Search code examples
asp.nettwitter-bootstrapevent-handlingbuttonclick

How to create Button_Click() Event for Bootstrap Button?


Bootstrap login form is below:

<form class="form-vertical login-form" runat="server" action="~/Default.aspx">
    <label class="control-label visible-ie8 visible-ie9">User Name</label>
        <input class="m-wrap placeholder-no-fix" type="text" placeholder="UserName" name="username"/>
    <label class="control-label visible-ie8 visible-ie9">Password</label>
        <input class="m-wrap placeholder-no-fix" type="password" placeholder="Password" name="password"/>
    <button type="submit" class="btn green pull-right" aria-pressed="undefined">
    Log In <i class="m-icon-swapright m-icon-white"></i>
    </button>            
</form>

When the button is clicked, I want to create the connection to the database. So, I need to have sth like this:

protected void (ButtonName)_Click(object sender, EventArgs e)
{
    string connStr = "Initial Catalog=LoginCheck; Data Source=MYCOMPUTER; User id=sa; password=000000;";
    SqlConnection conn = new SqlConnection(connStr);
    conn.Open();
    ...
} 

But it doesn't work like ASP.NET. If I double-click on the button when I am designing, it's not taking me to code behind. Please put me in the right direction!


Solution

  • In ASP.Net, you want to use Server control if you want to post back.

    Most of the time, <form> tag is located inside Master Page, so you cannot style it easily.

    Here is an example -

    <form id="form1" runat="server">
        <div class="form-vertical login-form">
            <asp:Label runat="server" ID="UsernameLabel"
                AssociatedControlID="UserNameTextBox"
                CssClass="control-label visible-ie8 visible-ie9">User Name
            </asp:Label>
            <asp:TextBox runat="server" ID="UserNameTextBox"
                CssClass="m-wrap placeholder-no-fix" />
    
            <asp:Label runat="server" ID="PasswordLabel"
                AssociatedControlID="PasswordTextBox"
                CssClass="control-label visible-ie8 visible-ie9">Password
            </asp:Label>
            <asp:TextBox runat="server" ID="PasswordTextBox"
                CssClass="m-wrap placeholder-no-fix" />
    
            <asp:LinkButton runat="server" ID="SubmitLinkButton"
                CssClass="btn btn-default pull-right" 
                OnClick="SubmitLinkButton_Click">
                Log In <i class="m-icon-swapright m-icon-white"></i>
            </asp:LinkButton>
        </div>
    </form>