J'ai une page ASP.NET où la page utilise la boîte de dialogue jQuery UI. Quand un utilisateur clique sur un bouton (btnGo) dans une page, je vais vérifier si l'utilisateur est connecté ou pas. Si je ne suis pas connecté, je montrerais la boîte de dialogue de l'interface utilisateur jQuery pour me connecter. J'ai utilisé ce code:ASP.NET avec jQueryUI: l'événement côté serveur ne se déclenche pas
<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>
<!-- <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>
Et sur le côté serveur:
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");
}
}
Le code ci-dessus fonctionne bien peu. Si un utilisateur n'est pas connecté, il affichera la boîte de dialogue jQuery UI pour se connecter. Mais le problème est, la fonction côté serveur btnLogin_Click() (événement Click du bouton ASP.NET btnLogin) ne se déclenche pas. Je l'ai essayé dans une autre page de test en plaçant une balise de formulaire juste avant le fieldset et cela a fonctionné. Ex:
<form id="form1" runat="server">
<fieldset> then rest of the items...(text box and button)
Mais je ne peux pas faire cela dans la première page, parce que si je place la balise form juste avant le jeu sur le terrain, mon autre zone de texte ASP.NET et le bouton seraient de la forme et en essayant de l'exécuter montre une erreur, disant que le contrôle de boîte de txt doit être dans le formulaire.
Je sais que nous ne pouvons pas utiliser plusieurs formulaires dans cette page avec runat="server".
Quelle est la solution à ce problème?
Le code javascript est:
<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>
Où est le JavaScript ?! –