title: clicking on tab moves on to next fieldset
body: <p>I have a form containing 13 <code>fieldsets</code> , each containing non uniform number of fields. I want to use tab to navigate between the fields and in the end it will move on to the next <code>fieldset</code>.</p>
  
  <p>I have written one javascript in which i have </p>
  
  <pre><code>$('#formElem &gt; fieldset').each(function(){
      var $fieldset = $(this);
          $fieldset.children(':last').find(':input').keydown(function(e){
              if (e.which == 9){
                  $('#navigation li:nth-child(' + (parseInt(current)+1) + ') a').click();
                  /* force the blur for validation */
                  $(this).blur();
              e.preventDefault();
              }
          });
  });
  </code></pre>
  
  <p>In my form when my page loads, when i click on tab button it moves on to the next page without traversing my fields in the current <code>fieldset</code>, but on the next <code>fieldset</code> clicking on tab makes makes my cursor to move to few fields then again without completing my fields it moves on to next <code>fieldset</code>.</p>
  
  <p>I am giving details of my first fieldset in my form</p>
  
  <pre><code>&lt;form id="formElem" name="formElem" action="report_form_submit.jsp" method="post"&gt;
  &lt;fieldset class="step"&gt;
  
                              &lt;legend&gt;General Information &lt;/legend&gt;
                              &lt;table&gt;
                              &lt;tr&gt;&lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="centers" &gt;Name of the Center&lt;/label&gt;
                                  &lt;%
                                  if(user_gr.equals("MA") || user_gr.equals("Ad")){
                                      %&gt;
                                      &lt;select name="centers" id="centers" &gt;
                                  &lt;option value=""&gt;Select Center&lt;/option&gt;
  
                                  &lt;!-- Populate Combobox from Database --&gt;
  
                                 &lt;%
                                  while(rsCenters.next()){
                                  %&gt;
  
                                  &lt;option value="&lt;%= rsCenters.getInt("id") %&gt;"&gt;&lt;%= rsCenters.getString("c_name") %&gt;&lt;/option&gt;
                                  &lt;%
                                  }
                                 // rsCenters.beforeFirst();
                                  %&gt;
                                  &lt;!-- Populate Combobox from Database --&gt;
  
                                  &lt;/select&gt;
                                      &lt;%
                                  }
                                  else{
                                      //System.out.println("...SQL CENTER :::"+sqlCenter);
                                      while(rsCenters.next()){
                                          center_name=rsCenters.getString("c_code");
                                      %&gt;
                                      &lt;input type="hidden" name="centers" id="centers" value="&lt;%= rsCenters.getInt("id") %&gt;" /&gt;
                                      &lt;input type="text" name="" id="" value="&lt;%= rsCenters.getString("c_name") %&gt;" disabled/&gt;
                                      &lt;%
                                      }
                                  }
                                  %&gt;
  
                                  &lt;!-- &lt;input id="username" name="username" /&gt; --&gt;
                               &lt;%
  }
  catch(Exception ex){
  
  System.out.println(ex);
  }
  %&gt;    
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="dt_enrolment"&gt;Date of enrolment&lt;/label&gt;
                                  &lt;input tabindex="1" id="dt_enrolment" name="dt_enrolment" type="text" onclick="gen_dt()" /&gt;
  
                              &lt;/p&gt;
  
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="srl_no"&gt;Serial No&lt;/label&gt;
                                   &lt;% if(!rsserial_no.next())
                                   {center_serial_no=center_name+1;}
                                   else
  {
      String received_serial_no=rsserial_no.getString("serial_no");
      center_serial_no=received_serial_no.substring(0, 3);
      String center_serial_no1=received_serial_no.substring(3);
      //int new_serial_no=0;
  
       int new_serial_no=Integer.parseInt(center_serial_no1);
  
      new_serial_no=new_serial_no+1;
      center_serial_no=center_serial_no+new_serial_no;}%&gt;
      &lt;input type="hidden" name="srl_no" id="srl_no" value="&lt;%= center_serial_no %&gt;" /&gt;
                                  &lt;input id="" name="" type="text" value="&lt;%=center_serial_no%&gt;" disabled /&gt;
  
  
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;/tr&gt;
                              &lt;tr&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="study_enrolment_no"&gt;Study enrolment No&lt;/label&gt;
                                  &lt;input tabindex="2" id="study_enrolment_no" name="study_enrolment_no" type="text" /&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="nm"&gt;Name&lt;/label&gt;
                                  &lt;input tabindex="3" id="nm" name="nm" type="text" /&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="age"&gt;Age&lt;/label&gt;
                                  &lt;input tabindex="4" id="age" name="age" type="text"/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;/tr&gt;
                              &lt;tr&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="gender"&gt;Gender&lt;/label&gt;
                                  &lt;!-- &lt;input id="gender" name="gender" type="text" /&gt; --&gt;
                                  &lt;select id="gender" name="gender" tabindex=""&gt;
                                  &lt;option value="Male"&gt;Male&lt;/option&gt;
                                  &lt;option value="Female"&gt;Female&lt;/option&gt;
                                  &lt;option value="Other"&gt;Other&lt;/option&gt;
                                  &lt;/select&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="address"&gt;Address&lt;/label&gt;
                                  &lt;input id="address" name="address" type="text" tabindex=""/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="ph_no"&gt;Phone No&lt;/label&gt;
                                  &lt;input id="ph_no" name="ph_no" type="text" class="nocheck" tabindex=""/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;/tr&gt;
  
                               &lt;tr&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="occupation"&gt;Occupation&lt;/label&gt;
                                  &lt;input id="occupation" name="occupation" type="text" tabindex=""/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="marital_status"&gt;Marital status&lt;/label&gt;
                                  &lt;select id="maritial_status" name="maritial_status" tabindex=""&gt;
                                      &lt;option value=""&gt;Select&lt;/option&gt;
                                      &lt;option value="Yes"&gt;Married&lt;/option&gt;
                                      &lt;option value="No"&gt;Unmarried&lt;/option&gt;
                                      &lt;/select&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="blood_gr"&gt;Blood group&lt;/label&gt;
                                  &lt;input id="blood_gr" name="blood_gr" type="text" tabindex=""/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;/tr&gt;
  
                              &lt;tr&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="religion"&gt;Religion/Cast/Community&lt;/label&gt;
                                  &lt;select id="religion" name="religion" class="nocheck" tabindex=""&gt;
                                      &lt;option value=""&gt;Select&lt;/option&gt;
                                      &lt;option value="Hindu"&gt;Hindu&lt;/option&gt;
                                      &lt;option value="Muslim"&gt;Muslim&lt;/option&gt;
                                      &lt;option value="Christian"&gt;Christian&lt;/option&gt;
                                      &lt;option value="Buddhist"&gt;Buddhist&lt;/option&gt;
                                      &lt;option value="Other"&gt;Other&lt;/option&gt;
                                  &lt;/select&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="vac_hbsag"&gt;Vaccinated for HBsAg&lt;/label&gt;
                                  &lt;select id="vac_hbsag" name="vac_hbsag" tabindex=""&gt;
                                      &lt;option value=""&gt;Select&lt;/option&gt;
                                      &lt;option value="Yes"&gt;Yes&lt;/option&gt;
                                      &lt;option value="No"&gt;No&lt;/option&gt;
                                      &lt;/select&gt;                               
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;p&gt;
                                  &lt;label for="monthly_income"&gt;Monthly Income&lt;/label&gt;
                                  &lt;input id="monthly_income" name="monthly_income" type="text" tabindex=""/&gt;
                              &lt;/p&gt;
                              &lt;/td&gt;
                              &lt;/tr&gt;
  
                              &lt;tr&gt;
                                  &lt;td colspan="3"&gt;
  
                                  &lt;p&gt;
                                  &lt;label for="edu_level"&gt;Education level&lt;/label&gt;
                                  &lt;select id="edu_level" name="edu_level" tabindex=""&gt;
                                      &lt;option value=""&gt;Select&lt;/option&gt;
  
                                      &lt;%
                                  while(rsLevel.next()){
                                  %&gt;
  
                                  &lt;option value="&lt;%= rsLevel.getInt("id") %&gt;"&gt;&lt;%= rsLevel.getString("edu_name") %&gt;&lt;/option&gt;
                                  &lt;%
                                  }
                                  %&gt;
  
                                  &lt;/select&gt;
                              &lt;/p&gt;
                                  &lt;/td&gt;
                              &lt;/tr&gt;
                              &lt;/table&gt;
                          &lt;/fieldset&gt;
  </code></pre>
  
  <p>tell me how can i fix this problem. even though i have use <code>tabindex</code> but it is not working properly</p>