2013-08-26 11 views
8

Ho un button e un dropdownlstL'evento di invio del modulo non acquisisce OnSelectedIndexChanged?

enter image description here

E ho questo script:

$("form").submit(function (e) 
    { 
     $('#divOverlay').show(); 
     }); 

mio obiettivo:

Quando un modulo sostiene, ho bisogno di mostrare un "carico div ":

Domanda:

Quando si preme il pulsante si fa mi mostra il div (div grigia che lampeggia per un secondo):

enter image description here

Ma quando cambio indice sul DropDownList:

<asp:DropDownList runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True"> 
    <asp:ListItem Value="a"> a</asp:ListItem> 
     <asp:ListItem Value="b">b</asp:ListItem> 
</asp:DropDownList> 

non submit ma io dont vedere il div:

enter image description here

Perché la $("form").submit(function (e) non significa catturare questo postback che si verifica il cambiamento indice dopo selezionato? ?

NB:

Fiddler mostra entrambi gli eventi (premendo il pulsante & & indice di cambiamento) come POST comando

Qual è la struttura del file? (Pseudo):

<html > 
<head> 
...  
</head> 
<body> 
    <div id='divOverlay'> 
     ... 
    </div> 

     <form id="form1" runat="server" > 
      <asp:Button runat="server" Text="sssssss"/> 
     <asp:DropDownList runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True"> 
      ... 
     </asp:DropDownList> 

     </form> 


     <script type="text/javascript"> 
      $(function() 
       { 
        $("form").submit(function (e) 
        { 
          $('#divOverlay').show(); 
        }); 
       }); 

     </script> 
</body> 
</html> 

Potete mostrare la differenza tra le due richieste che hanno inviato al server? **Yes. **

Il lato destro è quando l'indice viene modificato e il pannello di sinistra è per premere il pulsante

enter image description here

+0

Forse questo aiuterà: http://stackoverflow.com/questions/2073384/jquery-form-submitfn-does-not-work-with-asp-net – Johan

+0

@Johan Provato con entrambi document.ready e senza - e non funziona ancora –

+0

Questo sembra essere correlato: http: // stackoverflow.com/questions/1230573/how-to-capture-submit-event-using-jquery-in-an-asp-net-application Forse th agli aiuti? – michael81

risposta

2

C'è il metodo di un ASP.NET: ClientScript.RegisterOnSubmitStatement, che consente di eseguire una dichiarazione JavaScript ogni volta che il HtmlForm è presentata

ClientScript.RegisterOnSubmitStatement(this.GetType(), "divOverlayShow", "$('#divOverlay').show();"); 
+0

Funziona. grazie! Investirò su ciò che JS genera dietro. –

+0

Strano, ma '$ (" form "). Attr ('onsubmit', 'alert (1);');' funziona. mentre il collegamento del gestore di eventi JS non funziona ... –

1

Credo che il comportamento AutoPostBack è quello di inviare il modulo tramite javascript e una chiamata a __doPostBack() , che non attiva l'evento di invio.

Si può provare:

<asp:DropDownList onchange="$('#divOverlay').show();" runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True"> 
+0

submit è un metodo javascript dell'oggetto form. È anche un evento attivato quando il modulo viene inviato dall'utente. Ma non viene attivato quando il modulo viene inviato tramite codice. vedi http://stackoverflow.com/q/645555/1236044 – jbl

0
non

sicuro, suona come il postback del DDL e della forma r parte di diversi.

comunque vorrei consigli u per risolvere semplicemente facendo cadere l'AutoPostBack dal DDL e aggiungere un lato client onchange dove u può né dimostrare il div grigio e poi postback manualmente il lato server onselect come questo: http://bresleveloper.blogspot.co.il/2012/05/force-updatepanel-postback.html o solo $ ("modulo").submit()

+0

L'intero scopo è aggiungere uno script che mostri un div per un ** sito ** che significa - non toccare l'html e risolverlo con JS puro . e la tua soluzione richiede di cambiare la funzionalità/codice per ogni pagina –

+0

penso che mi sia sfuggito qualcosa qui Royi, che stai facendo comunque questo $ ("form"). submit (function (e) {$ ('# divOverlay'). show() ;}) ;, perché non puoi semplicemente aggiungere qualche riga? mi dispiace per l'ignoranza m8 – bresleveloper

+0

questo è fatto su un file JS separato (file js) .p.s. ho già trovato una soluzione. domani aggiornamento malato. –

0

Non so se questo sarebbe d'aiuto ma questo ha funzionato per me. Posso mostrare il div overlay in entrambi gli eventi.

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("form").submit(function (e) { 
       alert("Submit"); 
      }); 
      $("#dropdown").change(function (e) { 
       alert("Hi"); 
      }); 
     }); 

    </script> 
</asp:Content> 
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 
    <asp:Button runat="server" ID="submitbutton" Text="submit"/> 
    <asp:DropDownList ID="dropdown" ClientIDMode="Static" runat="server" AutoPostBack="True" OnSelectedIndexChanged="OnSelectedIndexChange"/> 
</asp:Content> 
Problemi correlati