jQuery Login modal popup for ASP.NET 2.o Page

Question

I have an ASP.NET web page(Not MVC ) (HomePage.aspx) and another page (PRiceList.aspx).I have a login feature in my Home page.So when a user logged in the site, They can go to t

Answer 1

Use a jquery dialog:

http://jqueryui.com/demos/dialog

This needs you to add the modal back to the DOM too.

jQuery(".loginPanel").each(function() 
{ 
   var popup = jQuery(this); 
   popup.parent().appendTo(jQuery("form:first")); 
});

Answer 2

jQuery Modal Form Dialog is your way to go here. I made a test app doing what you wanted with it and it worked well.

Markup for your ASPX page:

<div id="dialog" title="Please Login">
        <asp:Login ID="login" runat="server" />
</div>

Javascript needed for the page:

$(document).ready(function() {
$("#dialog").dialog({
    bgiframe: true,
    autoOpen: false,
    height: 300,
    modal: true,
    buttons: {
        Cancel: function() {
            $(this).dialog("close");
        }
    },
    close: function() {
        allFields.val("").removeClass("ui-state-error");
    }
});

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

Code behind I used on the aspx page:

ClientScript.RegisterHiddenField("isAuthenticated", "false");

You would give it true or false, depending on if the user was authenticated, so the javascript would know to display the login or not.

Now about the security. The login wouldn't be done by the javascript because the user would hit the button on that login page and it would post back to the server like normal. If you wanted to use ajax, you would have to check out the jQuery $.ajax method.