Question

I have a form that uses twitter bootstrap js and css.
In my form there exist two buttons.
One button submits the form and sends the user to someplace.
And another button shows a popover dialog.

I need second button not to be clickable but showing popover.

When i totally disable button, popover isn’t shown,
when i don’t disable button, it goes to the form’s action page.
How can i fix this?

http://jsfiddle.net/wnTUV/6/

<form class="well span3" action="/gosomeplace/" method="post">

    <div class="span3">

        <button type="submit" class="btn btn-info btn-large" href="gosomeplace/">
        <i class="icon-user icon-white"></i>
        Go now
    </button>
    </div>

    <div class="span3">
    <button class="btn disabled" rel="popover"
            title="Some title"
            data-content="Some content"
        >
        <i class="icon-question-sign"></i>
    </button>
        </div>


</form>

Answer 1

Have you tried using the onclick and returning false, or does that also prevent the popup? You would need to keep the button enabled, but this should prevent it from submitting the form.

<button onclick="return false;" class="btn disabled" rel="popover"
        title="Some title"
        data-content="Some content">

How to prevent buttons from submitting forms