Preventing form submission when more than one button present in a view
<p>A view is having more than one button as</p>

<pre><code>&lt;div class="row"&gt;
&lt;div class="col-md-3"&gt;
    @if(Model.Q&gt;1)
    {
        @Html.ActionLink("Previous","Perform","Test",new{q=Model.Q-1},new{@class="btn btn-success",id="test-previous-btn"})
    }
    &lt;input type="submit" value="Next" class="btn btn btn-success" id="test-next-btn" /&gt;
&lt;/div&gt;
&lt;div class="col-md-3"&gt;
    &lt;input type="button" data-confirm="Are you sure that you want to submit?" value="Submit" class="btn btn btn-primary" id="test-submit-btn" /&gt;
    &lt;input type="button" value="Cancel" class="btn btn-danger" id="test-cancel-btn" /&gt;
&lt;/div&gt;
</code></pre>

<p></p>

<p>I want a confirmation from the user for the submit button, So I use following javascript function </p>

<pre><code>$('#test-submit-btn').click(function(event){
    var result=confirm("Are you sure! You want to submit?");
    if(!result)
    {
        event.preventDefault();
        return false;
    }

});
</code></pre>

<p>It does not prevent submission to occur, irrespective of what was users response. However, If i remove other buttons, it functions as expected. </p>

<p>Your solution please!</p>