2009-05-18 3 views
3

Ich habe eine ASP.NET-Seite, wo die Seite jQuery UI-Dialog verwendet. Wenn ein Benutzer auf einer Seite auf eine Schaltfläche (btnGo) klickt, überprüfe ich, ob der Benutzer angemeldet ist oder nicht. Wenn nicht angemeldet, würde ich den jQuery UI Dialog zur Anmeldung anzeigen. Ich habe diesen Code:ASP.NET mit jQueryUI: Server-Side-Event nicht feuern

<body> 
<form id="form1" runat="server"> 
<div> 
    <br /> 
    <asp:TextBox ID="txtModelId" runat="server" Text="12"></asp:TextBox><br /> 

    <asp:Button ID="btnGo" runat="server" Text="Go" OnClick="btnGo_Click" /> 
    <br /> 
    <asp:Label ID="lblUserMsg" runat="server" Text="Label"></asp:Label></div> 
    <div id="divContentHolder"> 
    <div class="demo"> 

    <div id="dialog" title="Login with your User Account"> 
    <p id="validateTips">Enter your EmailId & password</p> 


    <fieldset> 

    <label for="email">Email</label> 
    <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" /> 
    <label for="password">Password</label> 
    <asp:TextBox ID="txtFirstName" CssClass="text ui-widget-content ui-corner-all" runat="server" Text=""></asp:TextBox> 
    <!-- &nbsp;<asp:Button ID="btnSingIn" runat="server" OnClick="btnSingIn_Click" Text="Button" /><br />--> 
    <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click" /> 
    </fieldset> 

    </div><!--dialog--> 
    </div><!--demo--> 
    </div><!--divContentHolder--> 

</form> 

Und auf der Serverseite:

protected void btnGo_Click(object sender, EventArgs e) 
    { 
     CheckUserLoggedIn(); 
    } 

private void CheckUserLoggedIn() 
    { 
     if (Session["username"] != null) 
     { 
      Response.Write("Logged in user"); 
      ClientScript.RegisterHiddenField("isAuthenticated", "true"); 
     } 
     else 
     { 
      ClientScript.RegisterHiddenField("isAuthenticated", "false"); 
     } 
    } 

Der obige Code funktioniert etwas in Ordnung. Wenn ein Benutzer nicht angemeldet ist, wird der Dialog jQuery UI zur Anmeldung angezeigt. Aber das Problem ist, die Server-Seite Funktion btnLogin_Click() (klicken Sie auf Ereignis der ASP.NET-Schaltfläche btnLogin) wird nicht ausgelöst. Ich habe es in einer anderen Testseite versucht, indem ich ein Formular-Tag direkt vor dem Fieldset platziert habe und es funktioniert. Ex:

<form id="form1" runat="server"> 
<fieldset> then rest of the items...(text box and button) 

Aber ich kann diese auf der ersten Seite nicht, denn wenn ich den Formular-Tag kurz vor dem Feldsatz platzieren, mein anderes ASP.NET Textfeld und Schaltfläche aus der Form sein würden, und wenn Sie versuchen, es auszuführen, zeigt es einen Fehler an, sagend, dass das txt Kastensteuerelement in der Form sein muss.

Ich weiß, wir können nicht mehrere Formulare auf dieser Seite mit runat="server" verwenden.

Was ist die Lösung für dieses Problem?

Der Javascript-Code ist:

<script type="text/javascript"> 
$(function() { 

    var name = $("#name"), 
     email = $("#email"), 
     password = $("#password"), 
     allFields = $([]).add(name).add(email).add(password), 
     tips = $("#validateTips"); 

    function updateTips(t) { 
     tips.text(t).effect("highlight",{},1500); 
    } 

    function checkLength(o,n,min,max) { 

     if (o.val().length > max || o.val().length < min) { 
      o.addClass('ui-state-error'); 
      updateTips("Length of " + n + " must be between "+min+" and "+max+"."); 
      return false; 
     } else { 
      return true; 
     } 

    } 

    function checkRegexp(o,regexp,n) { 

     if (!(regexp.test(o.val()))) { 
      o.addClass('ui-state-error'); 
      updateTips(n); 
      return false; 
     } else { 
      return true; 
     } 

    } 

    $("#dialog").dialog({ 
     bgiframe: true, 
     autoOpen: false, 
     height: 300, 
     modal: true, 
     buttons: { 
      'Create an account': function() { 
       var bValid = true; 
       allFields.removeClass('ui-state-error'); 

       bValid=true; 
       if (bValid) { 

        /*$('#users tbody').append('<tr>' + 
         '<td>' + name.val() + '</td>' + 
         '<td>' + email.val() + '</td>' + 
         '<td>' + password.val() + '</td>' + 
         '</tr>'); */ 

         alert("Check User Credentials") 
        $(this).dialog('close'); 
       } 
      }, 
      Cancel: function() { 
       $(this).dialog('close'); 
      } 
     }, 
     close: function() { 
      allFields.val('').removeClass('ui-state-error'); 
     } 
    }); 



    $('#create-user').click(function() { 
     $('#dialog').dialog('open'); 
    }) 
    .hover(
     function(){ 
      $(this).addClass("ui-state-hover"); 
     }, 
     function(){ 
      $(this).removeClass("ui-state-hover"); 
     } 
    ).mousedown(function(){ 
     $(this).addClass("ui-state-active"); 
    }) 
    .mouseup(function(){ 
      $(this).removeClass("ui-state-active"); 
    }); 

//}); 
var isAuthenticated = $("#isAuthenticated").val(); 
if (isAuthenticated && isAuthenticated == "false") 
{ 
// Display the modal dialog. 
$("#dialog").dialog("open"); 
} 
}); 
</script> 
+0

Wo ist das JavaScript ?! –

Antwort

10

Try UseSubmitBehavior=false auf die Schaltfläche Steuerungseinstellung. Anscheinend ändert das jQuery BlockUI-Widget das Verhalten der Schaltfläche und es wird nicht korrekt gesendet.

See: http://encosia.com/2008/10/04/using-jquery-to-enhance-aspnet-ajax-progress-indication/

+0

Ja Das hat funktioniert. Danke Alot – Shyju

+0

Aber in Server-Seite, bekomme ich den Wert in ASP.NET-Textfeld Steuerelemente ausgefüllt als null Beispiel: txtFirstName.Text Irgendwelche Idee? – Shyju

+1

Ja, ich hatte das gleiche passiert, Shyju. Ich folgte dem Link in Vondip's Antwort und änderte die Art, wie ich den Dialog mit jQuery zeige: var dlg = $ ("# AddEditDialog") .dialog ({modal: true}); dlg.parent(). AppendTo ($ ("form: first")); –