Question

1

How do I navigate to another page on button click with Twitter Bootstrap?

rated 0 times [ 7] [ 6] / answers: 1 / hits: 97428 / 12 Years ago, sat, september 1, 2012, 12:00:00

I have to render a html page residing in templates/home.html

I have a button in index.html as:

<div id=browse_app>

    <button class=btn btn-large btn-info type=button>Browse</button>

</div>

All I want to do is when I click on Browse, it takes me to home.html

I tried to write jQuery as:

// onClick on 'Browse' load the internal page

$(function(){

    $('#browse_app').click(function(){

        $.load('templates/home.html');

    });

});

But this doesn't work since load needs to put data somewhere in current page

How do I get to the home.html on button click?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

natalyah

Add To Favorites

Follow

Total Points: 371

Total Questions: 90

Total Answers: 105

Location: The Bahamas

Member since Wed, Apr 12, 2023

1 Year ago

answered 12 Years ago longd · Accepted Answer

As far as I can tell you are using Twitter Bootstrap. The documentation for Buttons addresses your point:

Default buttons

Button styles can be applied to anything with the .btn class applied. However, typically you'll want to apply these to only <a> and <button> elements for the best rendering.

This is what you want:

<div id="browse_app">

  <a class="btn btn-large btn-info" href="templates/home.html">Browse</a>

</div>

In the worst case scenario, this way the rendering of the button won't look nice but the link will work. Using JS, your worst case scenario will render the link useless.