Asp.net Button component doesn't work under Twitter-Bootstrap theme

Question

I've been using twitter-bootstrap for my asp.net website theme and I've ran into some trouble when trying to make a simple button execute an event. The button is an asp component, from what I've read in the forums is that bootstrap doesn't manage quite well with asp.net components, either being a Script( most obvious ) or a CSS problem ( I don't know, I'm no expert on what's going on ).

As far as I've seen the button takes action when I place it inside a form, however it's not the action that should take place as far as I know.

And redirects to the same page but with these parameters:

?ctl00%24MainContent%24LogUsernameText=&ctl00%24MainContent%24LogPasswordText=&ctl00%24MainContent%24loginBtn=Sign+In%21

I've tried many answers that I've seen in other people questions, such as making it render as a HTML button and make it runat="server" and then on page load add an instance for it.

How can I get through this?

Code from master page:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Main.master.cs" Inherits="Main" %>





  

    
    
    
    
    

    
    
    


    

    

    
        
            
                
                    
                    
                    
                
                bitRain
                
                    
                        Home
                        Upload
                        FAQ
                    
                    
                        Sign Up
                        
                        
                            Sign In 
                            
                                
                                Username
                                
                                Password
                                
                                 
                                 
                                
                            
                        
                    
                

            
        
    

    

        

            
            

        

        

        
            bitRain Project

Chunk of code from the page:


            
                Sign In
            
            
                Username
                
                    
                
            
            
                Password
                
                    
                
            
            
                
                    
                        
                        Forgot my password

Code on .cs file:

public partial class LoginN_Register : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}

protected void loginBtn_Click(object sender, EventArgs e)
{
    Account log = new Account();
    string username = LogUsernameText.Text;
    string password = LogPasswordText.Text;
    string authentication = log.UserLogin(username, password);
    if (!string.IsNullOrEmpty(authentication))
    {
        // Create a new ticket used for authentication
        FormsAuthenticationTicket ticket = new FormsAuthenticationTicket(
           1, // Ticket version
           username, // Username associated with ticket
           DateTime.Now, // Date issued
           DateTime.Now.AddMinutes(30), // Date to expire
           true, // "true" for a persistent user cookie
           authentication, //Role
           FormsAuthentication.FormsCookiePath); //Path authorized

        string hash = FormsAuthentication.Encrypt(ticket);
        HttpCookie cookie = new HttpCookie(
        FormsAuthentication.FormsCookieName, hash);


        if (ticket.IsPersistent) cookie.Expires = ticket.Expiration;


        Response.Cookies.Add(cookie);

        string returnUrl = Request.QueryString["ReturnUrl"];
        if (returnUrl == null) returnUrl = "~/Users/User_Profile.aspx";

        Response.Redirect(returnUrl);

        base.OnLoad(e);
    }
    else
    {
        Alert.Text = "Warning! Best check yo self, you're not looking too good.";
        LogUsernameText.Text = "Fail";
    }
}
}

My guess is that theres some script redirecting my button event. I can't find it. I'm using the latest version of bootstrap theme.

datalekz · Accepted Answer

I found the answer to my question, on proprieties, you have the option UseSubmitBehaviour and set it to false, my guess is that it will get detected like a normal HTML submit button and bootstrap is prepared to change regular HTML components behaviour. ( I don't really know how to put it in better words. Feel free to edit. )

I mean... Bootstrap wasn't planned out to work 100% with asp.net components, so it would depend on javascript commands.

It has logic, since when it was a form it would grab all text fields and when the button was activated it would submit them for you. Creating the redirect that I mentioned above, hope this helps someone, as my brain went slowpoke and delayed me 2 days of work.

EDIT and Proper Solution:

Actually I got into exploring more how it all works and it's a validation issue, it will only submit if validations are fulfilled, either you have them or not, so you must go to proprieties if you're using VS and change Validation Required value to Disabled, don't worry a button will only validate inside it's form.

For those who don't have... A proprieties bar, add these to your button html code:

ValidateRequestMode="Disabled"

I decided to improve this answer with more reliable information, because I noticed that when searching for this problem solution I could only find my question and not a good answer on any other source, I found the "proper" solution a couple of months ago though...

Asp.net Button component doesn't work under Twitter-Bootstrap theme

Answers (2)

Related Questions

Asp.net Button component doesn&#39;t work under Twitter-Bootstrap theme

Answers (2)

Related Questions

Asp.net Button component doesn't work under Twitter-Bootstrap theme