Como posso confirmar e um botão, em seguida, desativar em asp.net/javascript
-
20-08-2019 - |
Pergunta
Eu tenho uma página web ASP.NET 2.0 padrão com um botão Delete nele. O que eu preciso e não consigo descobrir como retirar é quando o usuário pressiona o botão Excluir um popups de diálogo de confirmação perguntando ao usuário "você tem certeza?". Se o usuário diz que sim, então eu quero desativar o botão excluir e executar uma nova postagem que irá executar o deleteButton_Click código do lado do servidor.
Aqui está a tag:
<asp:Button ID="deleteButton" Text="Delete" OnClick="deleteButton_Click" runat="server" />
Aqui está o javascript (em jQuery) para lidar com o clique do lado do cliente:
var deleteButton = $(input.eq(0));
deleteButton.click( function()
{
var a = confirm( "Are you sure you want to delete this item?" );
if ( a == false )
{
return false;
}
else
{
deleteButton.attr( "disabled", "disabled" );
__doPostBack( deleteButton.attr( "id" ), "" );
}
} );
A caixa de diálogo de confirmação funciona como esperado e a desativação funciona ok também. A forma faz bem postback mas não executar o manipulador de eventos deleteButton_Click. O código __doPostBack javascript existe na página.
Eu poderia acrescentar UseSubmitBehavior = "false" à tag deleteButton mas então seria ignorar a resposta de diálogo de confirmação.
Então, talvez eu estou pedindo muito de ASP.NET aqui. Alguma idéia de como fazer este trabalho?
Obrigado,
Craig
Solução 3
Obrigado pelo feedback, mas foi uma solução bastante simples.
A linha de javascript deve ser:
__doPostBack( deleteButton.attr( "name" ), "" );
em vez de:
__doPostBack( deleteButton.attr( "id" ), "" );
Eu não tinha percebido que o atributo "nome" é a que método doPostBack estava procurando.
Outras dicas
btnSubmit.Attributes.Add("onclick", "if(confirm(\"Are you sure you want to delete this item?\" ){this.disabled=true;" + ClientScript.GetPostBackEventReference(btnSubmit, "").ToString() + "}else{return false;}");
Dê uma olhada esta pergunta StackOverflow eu achei muito útil:
botão Desactivar no formulário de submissão
Adicionar a lógica de confirmação ... e você deve ser definido ...
Eu fui uma cabeça e escreveu um método de extensão para você, e me bem:)
public static void ConfirmThenDisableButtonOnClick(this Button buttonControl, string confirmMessage, string clientFunction)
{
StringBuilder sb = new StringBuilder();
// If the page has ASP.NET validators on it, this code ensures the
// page validates before continuing.
if (buttonControl.CausesValidation && !String.IsNullOrEmpty(buttonControl.ValidationGroup))
{
sb.Append("if ( typeof( Page_ClientValidate ) == 'function' ) { ");
sb.AppendFormat(@"if ( ! Page_ClientValidate('{0}') ) {{ return false; }} }} ", buttonControl.ValidationGroup);
}
//pop confirm, if confirm==true, disable button
sb.AppendFormat("if(confirm('{0}\')){{this.disabled=true;", confirmMessage.Replace("\"","").Replace("'",""));
// If a secondary JavaScript function has been provided, and if it can be found,
// call it. Note the name of the JavaScript function to call should be passed without
// parens.
if (!String.IsNullOrEmpty(clientFunction))
{
sb.AppendFormat("if ( typeof( {0} ) == 'function' ) {{ {0}() }};", clientFunction);
}
// GetPostBackEventReference() obtains a reference to a client-side script function
// that causes the server to post back to the page (ie this causes the server-side part
// of the "click" to be performed).
sb.Append(buttonControl.Page.ClientScript.GetPostBackEventReference(buttonControl, ""));
// if confirm==false do nothing
sb.Append(";}else{return false;}");
// Add the JavaScript created a code to be executed when the button is clicked.
buttonControl.Attributes.Add("onclick", sb.ToString());
}
acabou de adicionar verificação de validação, bem como:)
Ao invés de fazer uma nova postagem através de javascript, você pode usar OnClientClick para realizar a mesma coisa.
<asp:Button OnClientClick="if (confirm('Are you sure?')) {this.disabled = true;} else {return false;}" />
Ou se você deseja realizar mais ações através de javascript do que simplesmente desabilitar o botão, você pode dizer algo como isto:
<asp:Button OnClientClick="return DisableOnConfirm();" />
Você só precisa ter certeza de que você está redação na forma de uma instrução de retorno de modo que quando você não quer que a função ASP a prazo, a declaração acabará por dizer "return false;"
.Javascript:
deleteButton.disabled = true;
C #:
deleteButton.Enabled = false;
Você provavelmente deve desativar o botão no lado do servidor em caso deleteButton_Click (porque você vai fazer uma nova postagem, para que recriar a página).
<asp:Button ID="deleteButton" Text="Delete" OnClick="deleteButton_Click" runat="server" OnClientClick="javascript:return confirm('are you sure blah blah blah ...')" />
E no code-behind:
private void deleteButton_Click(object sender, EventArgs e) {
deleteButton.Enabled = false;
// and the rest of event handling ...
}
É um pouco estranho que o evento clique não está disparando. Eu teria imaginado que era devido para o botão que está sendo desativado, mas geralmente isso só acontece quando o botão está desabilitado no servidor, e não apenas o cliente. Embora não seja a solução ideal na sua função Page_Load você pode verificar se há uma nova postagem e / ou postback assíncrono e determinar o destino do postback (neste caso, o seu o seu botão) e, em seguida, chamar algum método de lá. Você também pode passar argumentos usando a função __doPostBack ().
Inicialmente, eu não tinha certeza se você estava falando sobre o clique evento do lado do cliente ou o evento do lado do servidor clique. Eu acho que você deve explicitamente estado que o clique evento do lado do servidor não está disparando.
De qualquer forma, tente <% @ Page EnableEventValidation = "false" %> em sua página ASPX e ver se funciona (Ele é definido como true por padrão). Eu não me lembro o âmago da questão da funciona este atributo mas esse recurso garante que o evento do lado do servidor é acionado apenas em casos legítimos. Por exemplo. vamos dizer que sua página tinha vulnerabilidade XSS e um hacker injetado JavaScript para invocar o botão delete. Esse atributo ajuda a prevenir esses ataques.
$(":submit").click(function ()
{
$(this).attr("disabled", true); // disable input
if (confirm("Press OK to submit"))
{
__doPostBack(this.id, ""); // if user presses OK; submit
}
else
{
// If user presses cancel; enable input and stop submit
$(this).attr("disabled", false);
return false;
}
});
Eu decidi fazer esta uma função JS que poderia ser chamado de qualquer botão.
Aqui está um exemplo que funciona, no entanto, gostaria de mover o JavaScript para um lugar diferente, como um já existente .js arquivo ou a tag cabeça.
<script>
function confirmPostback(button) {
if (confirm('Are you sure?')) {
button.disabled = true;
__doPostBack(button.name, '')
return true;
} else {
return false;
}
}
</script>
<asp:Button ID="TestPostback" runat="server" Text="Test Postback"
UseSubmitBehavior="false" OnClientClick="return confirmPostback(this)" />