How to retain in current tab after submitting the form

Question

My problem is i want to retain the current tab even after submitting the form or refreshing the page

My View File Looks like this:

<ul class='tabs'>
        <li><a href='#tab1'>Tab 1</a></li>
        <li><a href='#tab2'>Tab 2</a></li>
    </ul>
<div id='tab1'>
        <h3>Section 1</h3>
        <p>Lorem ipsum dolor sit amet, consssectetur adipiscing elit. Donec lobortis placerat dolor id aliquet. Sed a orci in justo blandit commodo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>
            <form id="form1" action="" method="post">            
  <input id="button-1" name="" type="submit" />
</form>
    </div>
<div id='tab2'>
<a name="tab2"></a>
        <h3>Section 2</h3>
        <p>Aenean et est tortor. In pharetra pretium convallis. Mauris sollicitudin ligula non mi hendrerit varius. Fusce convallis hendrerit mauris, eu accumsan nisl aliquam eu.</p>

  <form id="form2" action="" method="post">            
  <input id="button-2" name="" type="submit" />
</form>
    </div>
<div>
<h2>RESULTS </h2>
</div>

Now i want to to be in the same tab in which i click the submit button even after post back ..

Please help me to resolve this problem..

Thanks

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/ — A. Wolff, Dec 06 '13 at 09:19
@A.Wolff .. please post the link as answer so that i can mark it as answer — DS kumar, Dec 06 '13 at 09:52

score 2 · Accepted Answer · answered Dec 06 '13 at 09:55

You need to use ajax to submit form in order to keep user on same page. Basically, you need to prevent form to be submitted and send request to server using ajax.

You can have a look here to see a good tutorial:

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

score 1 · Answer 2 · edited May 23 '17 at 12:14

1

check out ajax form submits, with ajax, you do not reload the page that your on jQuery makes it easier and it can be used like so

$("#form2").ajaxForm({url: 'server.php', type: 'post'})

then check out this answer:

jQuery AJAX submit form

edited May 23 '17 at 12:14

Community

1
1

answered Dec 06 '13 at 09:22

roo2

5,571
2
28
44

How to retain in current tab after submitting the form

2 Answers2