1

I am trying to load a login page through JQuery UI. When I debugged the code, found that it gets debugged to the page_load event and after running the application, the controls in that page is not getting displayed in front end?

In Master page I have a Login button, on clicking the button Login page needs to be loaded using JQuery UI.

Login page has the following code:

<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
    <div id="loginPanel" runat="server">
        <asp:Label ID="lblUsername" runat="server" Text="Username"></asp:Label>
        <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox>
        <asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
        <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>
        <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="LoginClick" />
        <asp:Button ID="btnClear" runat="server" Text="Clear" />
        <asp:Label ID="lblErrorMessage" runat="server" Text=""></asp:Label>
    </div>
</asp:Content>

JQuery Code:

$.ajax({
      url: 'Login.aspx',
      success: function (data) {
          $('.result').html(data);
          alert('Load was performed.');
          }
      });

The page control values are getting loaded in the "data" but not getting displayed in the front page.

What do I need to do ?

SeanC
  • 15,695
  • 5
  • 45
  • 66
Sasirekha
  • 11
  • 1
  • I'm not 100% sure ... but I had a similar problem in MVC.It revolved around the passing of the URL. Maybe this will help : http://stackoverflow.com/questions/9988634/ajax-call-into-mvc-controller-url-issue – Mihai Labo Aug 29 '12 at 14:08
  • Curious if you've tried using `$('.result').load('Login.aspx');` instead. http://api.jquery.com/load/ – egbrad Aug 29 '12 at 14:14
  • Why would you use jQuery controls? – uSeRnAmEhAhAhAhAhA Dec 28 '13 at 04:23

1 Answers1

0

Is data a string? i.e. does it actually contain only the html that you want to load or is it a javascript object that you still need to get the html out of?

Also remember that you're probably going to lose your postback events on the buttons, so you might want to go the route of hooking up the buttons to javascript functions that will post to the relevant page.

hope that helps

EDITED WITH CODE SAMPLE BELOW: Note This solution is using jQuery, but I see you're using that already

Firstly you will need a file that includes the form that you want to use to log in with (In this case I added a JavascriptPost.aspx with the following contents in the body

<form id="frmPost" method="post" action="Default.aspx">
    <span>Username</span><input type="text" name="username" />
    <span>Password</span><input type="password" name="password" />
    <button onclick="login();">submit</button>
</form>

Then I added my default.aspx with the following contents:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="js/jquery-1.7.2.min.js"></script>
    <link href="css/main.css" rel="stylesheet" />
    <script type="text/javascript">
        function loadLogin() {
            $('#loginContainer').load('JavascriptPost.aspx #frmPost');
        };
        function login() {
            $('#frmPost').submit();
        }
    </script>
</head>
<body>
    <div>
        Some really cool stuff about the website
    </div>
    <button onclick="loadLogin()">Login</button>
    <div id="loginContainer"></div>
</body>
</html>

then finally to gain access to your form parameters you can use the Request to pull them out:

if (Request["username"] != null)
{
    string username = Request["username"];
    string password = Request["password"];
}

Let me know if you need further explination

Koenyn
  • 694
  • 4
  • 16