Question

In my page I have a login control:

<asp:Login ID="EMSLogin" runat="server" OnAuthenticate="EMSLogin_Authenticate">
    <LayoutTemplate>
        <asp:Panel ID="Panel1" runat="server" CssClass="wrapper">
            <asp:Panel ID="Panel2" runat="server" CssClass="holder">
                <asp:Panel ID="Panel3" runat="server" CssClass="loginBox one_edge_shadow">
                    <h1>
                        Login Credentials</h1>
                    <asp:Panel ID="Panel4" runat="server" CssClass="name topmargin">
                        <asp:Panel ID="Panel5" runat="server" CssClass="label">
                            <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">User Name:</asp:Label>
                        </asp:Panel>
                        <asp:Panel ID="Panel6" runat="server" CssClass="textBox">
                            <telerik:RadTextBox ID="UserName" runat="server" Height="16px" Width="165px" Font-Size="14px"
                                Font-Names="Arial Sans-Serif" ToolTip="Enter your valid login name" />
                            <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
                                ValidationGroup="EMSLogin">*</asp:RequiredFieldValidator>
                        </asp:Panel>
                        <br class="clearfix" />
                    </asp:Panel>
                    <asp:Panel ID="Panel7" runat="server" CssClass="name topmargin">
                        <asp:Panel ID="Panel8" runat="server" CssClass="label">
                            <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label>
                        </asp:Panel>
                        <asp:Panel ID="Panel9" runat="server" CssClass="textBox">
                            <telerik:RadTextBox ID="Password" runat="server" TextMode="Password" Height="16px"
                                Width="165px" Font-Size="14px" Font-Names="Arial Sans-Serif" ToolTip="Enter your valid password" />
                            <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
                                ValidationGroup="EMSLogin">*</asp:RequiredFieldValidator>
                        </asp:Panel>
                        <br class="clearfix" />
                        <telerik:RadButton ID="LoginButton" runat="server" CommandName="Login" Text="Log In"
                            CssClass="loginButton" Font-Size="14px" Width="100px" ValidationGroup="EMSLogin"
                            ToolTip="Click to log in" />
                    </asp:Panel>
                </asp:Panel>
            </asp:Panel>
        </asp:Panel>
    </LayoutTemplate>
</asp:Login>

I have added the ScriptManager control to the page.

Now the EMSLogin_Authenticate is:

protected void EMSLogin_Authenticate(object sender, AuthenticateEventArgs e) {
    RadTextBox UserName = EMSLogin.FindControl("UserName") as RadTextBox;
    RadTextBox Password = EMSLogin.FindControl("Password") as RadTextBox;

    if (Membership.ValidateUser(UserName.Text, Password.Text)) {
       FormsAuthentication.RedirectFromLoginPage(UserName.Text, false);
    } else {
       Page.ClientScript.RegisterClientScriptBlock(typeof(ScriptManager), "CallShowDialog", "showDialog();", true);     
    }
}

The JavaScript method showDialog(); is defined in the page:

<script type="text/javascript">
    function showDialog() {
        $(".jym").dialog("open");
        return false;
    }   
</script>

But it is not calling. There is nothing wrong with showDialog() since I have called it on the onclick method of an anchor tag; it is showing the dialog. If I write alert() in place of showDialog() in code behind then I can see the alert message.

What I am doing wrong? Is it not possible to call JavaScript in this way?

---

This is also not working:

System.Web.UI.ScriptManager.RegisterClientScriptBlock(this.Page, typeof(RadButton), Guid.NewGuid().ToString(), "showDialog();", true);

Answer 1

The RegisterClientScriptBlock put the code before the document, so by the time you are calling the function, there is no element with class jym just yet. You can add alert($(".jym").length) to confirm that, you’ll see 0.

Why not calling the function from client side?

$(document).ready(function() {
    showDialog();
});

If you need it server side, just change your code to:

if (Membership.ValidateUser(UserName.Text, Password.Text)) {
   FormsAuthentication.RedirectFromLoginPage(UserName.Text, false);
} else {
   Page.ClientScript.RegisterClientScriptBlock(typeof(ScriptManager), "CallShowDialog", "$(document).ready(function() { showDialog(); });", true);     
}