Why are my C# functions coming up as undefined?

Hi, I have three separate functions in my C# code to handle the visibility of my 3 forms (all on one page) so that there is never more than one form visible at a time (for error reasons).  I thought I had clearly defined them and called them properly but they are coming up as not defined in my web developer tools (and they are not working either):

user.aspx
        <ul class="tabs">
            <li runat="server" onclick="Login_Click"><a href="#login">Login</a></li>
            <li runat="server" onclick="NewPassword_Click"><a href="#newPassword">Forgot Password</a></li>
            <li runat="server" onclick="SignUp_Click"><a href="#signup">Sign Up</a></li>
        </ul>

Open in new window



user.aspx.cs
        public void Login_Click()
        {
            LoginForm.Visible = true;
            NewPaswordForm.Visible = false;
            SignUpForm.Visible = false;
            Response.Write(string.Format("<script type='text/javascript'>alert('login');</script>"));
        }
        public void NewPassword_Click()
        {
            LoginForm.Visible = false;
            NewPaswordForm.Visible = true;
            SignUpForm.Visible = false;
            Response.Write(string.Format("<script type='text/javascript'>alert('password');</script>"));
        }
        public void SignUp_Click()
        {
            LoginForm.Visible = false;
            NewPaswordForm.Visible = false;
            SignUpForm.Visible = true;
            Response.Write(string.Format("<script type='text/javascript'>alert('signup');</script>"));
        }

Open in new window


They are suppose to display each form according to which tab was clicked. Can someone please help me to get my functions working properly?

http://auroriella.com/user.aspx

I believe the only reason the first one appears to be working is because its defaulted to display upon the page loading:

        protected void Page_Load(object sender, EventArgs e)
        {
            LoginForm.Visible = true;
}

Open in new window

FairyBusinessAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Kiran SonawaneProject LeadCommented:
Add hyperlinks within li tags and handle the onclick event on hyperlinks instead of li tags
0
nishant joshiTechnology Development ConsultantCommented:
there is no form and buttons like forgotpassword or signup in your sections which ids are newPassword and signUp...


regards.
0
APoPhySptCommented:
Instead of using the Visible atribute, try using something like:

LoginForm.Disabled = true; so that instead of just making it invisible you are actually disabling the control.

don't really know if it is what you are looking but, but seems worth the try

cheers
0
Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

gman84Commented:
The reason why "Login" is 'working' (in so far as displaying the form) is because of your jQuery in "tabs.js". When you click on the link it is displaying the correct section, it is also displaying the other two sections, there just isn't anything in them.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
SimplistCommented:
Trying to reproduce I use asp:buttons instead of tabs, and the page told me: Control 'Login' of type 'Button' must be placed inside a form tag with runat=server.
When I did that the page showed up, but as soon as I clicked on a button it said: A page can have only one server-side Form tag.
I replaced the other forms by asp:placeholder's, moved all them in between the tags of the one and only form with runat=server on that page, and everything worked as requested.
Maybe all this is due to me testing this with Visual Studio web developer 2010 express
So keep to one form per page, use placeholders to manage the content shown.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="User.aspx.cs" Inherits="WebForms.User" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="MenuForm" runat="server">
    <asp:Button ID="Login" runat="server" Text="Log In" 
        onclick="Login_Click" /> <asp:Button ID="NewPassword" 
        runat="server" Text="New Password" onclick="NewPassword_Click" /> 
    <asp:Button ID="SignUp" runat="server" Text="Sign Up" 
        onclick="SignUp_Click" />
    <asp:PlaceHolder ID="LoginForm" runat="server">
    <div>
      <h1>Login</h1>
    </div></asp:PlaceHolder>
    <asp:PlaceHolder ID="NewPasswordForm" runat="server">
    <div>
      <h1>Change Password</h1>
    </div></asp:PlaceHolder>
    <asp:PlaceHolder ID="SignUpForm" runat="server">
    <div>
      <h1>Register</h1>
    </div></asp:PlaceHolder>
    </form>
</body>
</html>

Open in new window

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebForms
{
    public partial class User : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            LoginForm.Visible = false;
            NewPasswordForm.Visible = false;
            SignUpForm.Visible = false;
        }

        protected void Login_Click(object sender, EventArgs e)
        {
            LoginForm.Visible = true;
            NewPasswordForm.Visible = false;
            SignUpForm.Visible = false;
        }

        protected void NewPassword_Click(object sender, EventArgs e)
        {
            LoginForm.Visible = false;
            NewPasswordForm.Visible = true;
            SignUpForm.Visible = false;
        }

        protected void SignUp_Click(object sender, EventArgs e)
        {
            LoginForm.Visible = false;
            NewPasswordForm.Visible = false;
            SignUpForm.Visible = true;
        }
    }
}

Open in new window

0
keyuCommented:
once you set visibility false it will hide that control so when you call it it will not able to find that form and saying undefined message.

so instead of visibility

1) use javascript style.display='none'  or style.display='' "onclientclick" event

or

2) instead of 3 different form set action of that form from server side and submit that form.


0
FairyBusinessAuthor Commented:
Another reason why I don't think my C# functions are working is because the js alerts inside of them are not firing.  

@APoPhySpt I am trying this:

        public void Login_Click(object send, EventArgs e)
        {
            LoginForm.Disabled = false;
            NewPaswordForm.Disabled = true;
            SignUpForm.Disabled = true;
            Response.Write(string.Format("<script type='text/javascript'>alert('login');</script>"));
        }
        public void NewPassword_Click(object send, EventArgs e)
        {
            LoginForm.Disabled = true;
            NewPaswordForm.Disabled = false;
            SignUpForm.Disabled = true;
            Response.Write(string.Format("<script type='text/javascript'>alert('password');</script>"));
        }
        public void SignUp_Click(object send, EventArgs e)
        {
            LoginForm.Disabled = true;
            NewPaswordForm.Disabled = true;
            SignUpForm.Disabled = false;
            Response.Write(string.Format("<script type='text/javascript'>alert('signup');</script>"));
        }

Open in new window


but I'm not sure how to disable the forms on aspx web page? I tried disabling two of them in the Page_Load function but that didn't work, still got the error message of A page can have only one server-side Form tag.  In order to enable them they have to be disabled first, and disabling them on the aspx.cs page doesn't get their first.

@gman84  you were right nothing is showing up inside of them. Turning them invisible makes them disappear completely like keyu said.  

@keyu I tried changing the display to none in javascript but that didnt worked, I still get the message A page can have only one server-side Form tag.

How do I disable the forms on my user.aspx page?

 

@keyu I'm not sure about the whole java-script thing.  I mean when I try to disable the forms from my aspx.cs file it doesn't get there fast enough, and browser still sees first that there are 3 asp.net server forms on one page.  I don't get what you are trying to say in your second suggestion.
user.aspx
user.aspx.cs
0
gman84Commented:
I believe that @keyu is suggesting that you have a single frame encompasing the three different "forms" that you have ("Login", "NewPassword",etc..). This is workable in that you would then just be hiding areas within the form, which is what @SimpList suggested.

It's not possible to specify multiple forms on a page, without the use of the dreaded IFRAME.
0
FairyBusinessAuthor Commented:
I figured out a way to do it!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Ok, I left my three forms on my page as so (notice I turned their visibility off):

    <section id="login" class="tab">
        <form method="post" action="user.aspx" id="LoginForm" runat="server" visible="false">
            <label>Email<span class="red">*</span></label>
            <asp:TextBox id="loginEmail" value="" class="form-text" runat="server" />
            <label>Password<span class="red">*</span></label>
            <asp:TextBox id="loginPassword" value="" class="form-text" runat="server" />
            <br />
            <asp:Button text="Log In" class="form-submit" runat="server" OnClick="LogIn" />
        </form>
    </section>
    <section id="new_password" class="tab">
        <form method="post" action="user.aspx" id="NewPaswordForm" runat="server" visible="false">
            <label>Email Address<span class="red">*</span></label>
            <input type="text" name="retrieve-email" value="" class="form-text" />
            <br />
            <input type="submit" value="Submit" class="form-submit " />
        </form>    
    </section>
    <section id="signup" class="tab">
        <form method="post" action="user.aspx" id="SignUpForm" runat="server" visible="false">
            <article class="align-left">
            <label>First Name<span class="red">*</span></label>
            <asp:TextBox id="firstname" value="" class="form-text" ValidationGroup="Group1" runat="server" /><br />
            <label>Last Name<span class="red">*</span></label>
            <asp:TextBox id="lastname" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <!--<asp:RequiredFieldValidator ErrorMessage="This is required" runat="server" ControlToValidate="firstname" Display="dynamic" />-->
            <label>Email Address<span class="red">*</span></label>
            <asp:TextBox id="email" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <label>Password<span class="red">*</span></label>
            <asp:TextBox id="password" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <label>Re-enter Password<span class="red">*</span></label>
            <asp:TextBox id="repassword" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            </article>
            <article class="align-left">
            <label>Business Name<span class="red">*</span></label>
            <asp:TextBox id="business" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <label>Employer ID Number<span class="red">*</span></label>
            <asp:TextBox id="eid" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <label>Tax ID Number<span class="red">*</span></label>
            <asp:TextBox id="tid" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <label>Business Address<span class="red">*</span></label>
            <asp:TextBox id="address" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            <details class="align-left city">
                <label>City<span class="red">*</span></label>
                <asp:TextBox id="city" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            </details>
            <details class="align-left state">
                <label>State<span class="red">*</span></label>
                <asp:TextBox id="state" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            </details>
            <details class="align-left zip">
                <label>Zip<span class="red">*</span></label>
                <asp:TextBox id="zip" value="" class="form-text" ValidationGroup="Group1" runat="server" />
            </details>
            </article>
            <br />
            <asp:Button text="Sign Up" class="form-submit" runat="server" OnClick="SignUp" />
        </form>
    </section>

Open in new window


The forms still needed to be there or else the variables/functions that depend on them in my user.aspx.cs file would come up as not recognized and I would just get an error instead of it loading my page. So I left them just for the loading, then they disappear.  I made three separate files, each containing the forms, and the files I named the same as their section ids:

login.aspx, new_password.aspx, signup.aspx

and I load them in each time one of the tabs is clicked and empty the other two sections so that I never have more than one form on a page at one time:

    // tab menu on login/signup page
    $(tabMenu).click(function () {
        section = $("a", this).attr("href");  // gets id of the selected tab link
        $(this).addClass("active");  // activates currently selected tab
        $(tabMenu).not(this).removeClass("active");  // removes the active class from all other possible tabs
        $("section").not(section).hide().empty();  // hides the section that does not correspond to the id of the link clicked
        $(section).load(section.substring(1) + ".aspx");  // fades in the section whose id matches the href of the selected link
        alert((section.substring(1) + ".aspx"));
        $(section).fadeIn("slow");  // fades in the section whose id matches the href of the selected link
        widthLength(section);
        reset(section);
    });

Open in new window


Finally, I dynamically add the submit button's onclick events back so that the functions in the user.aspx.cs file can still be called (bc if I left them there they would not load in bc there is technically an error for having an onclick that doesn't link to anything yet).  So here is the one for the Login form:

    if ($("#LoginForm").length > 0) {
        $("input:submit", this).attr("onclick", "LogIn");
    }

Open in new window


For all of the ideas guys!!

@gman84 I thought about having just one form with and separating parts of the form into panels but I really wanted to validate each form differently and have the submit buttons (not only say different things) but do different things (that was going to be my last resort).
0
FairyBusinessAuthor Commented:
(I added my own comment in with the points so that other can know how to achieve the something similar to having more than one asp.net server form on a page)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
C#

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.