How to refocus cursor to invalid input element
I have a page in which a set of text boxes are created based on number of items being shipped:


    <c:forEach var="num" begin="1" end="${qtyToShip}" step="1" varStatus ="status">
      <tr>
        <td>
          <input class="form-med" type="text" name="shipItems[${num - 1 }].barCode" id="shipItems[${num - 1 }].barCode" onchange="if(!G2Step2Validate(this,'${shippingCommand.boxType}')){$(this).focus();}" />
        </td>
        <td>
          <input class="form-med" type="text" name="shipItems[${num - 1 }].shipCompanyBarCode"  onkeyup="if (!(event.keyCode==16 || (event.keyCode==9 && event.shiftKey))) {UPSStep2Validate(this);}"/>
        </td>
      </tr>
    </c:forEach>

Here is what I would like to happen.  When a user enters in a bar code, I need to make a AJAX call to validate that the bar code is valid (is available to be used, is correct for what is being shipped and has not already been used on this order - prevent duplicate scan).

Using DWR for AJAX and that service is all working fine.

The issue is that if the validation fails I would like the focus to return back to the field in question.  That is not happening.  The focus is always going to the next input box.  

I have tried to work with different events: change, blur, keyup etc.  I have tried with placing the focus inline, in the javascript, have tried with jQuery, javascript etc but no luck.

Looking for suggestions/solutions on how to place the focus back to the input box that is causing the issue.


How to refocus cursor to invalid input element
===

I have a page in which a set of text boxes are created based on number of items being shipped:


    <c:forEach var="num" begin="1" end="${qtyToShip}" step="1" varStatus ="status">
      <tr>
        <td>
          <input class="form-med" type="text" name="shipItems[${num - 1 }].barCode" id="shipItems[${num - 1 }].barCode" onchange="if(!G2Step2Validate(this,'${shippingCommand.boxType}')){$(this).focus();}" />
        </td>
        <td>
          <input class="form-med" type="text" name="shipItems[${num - 1 }].shipCompanyBarCode"  onkeyup="if (!(event.keyCode==16 || (event.keyCode==9 && event.shiftKey))) {UPSStep2Validate(this);}"/>
        </td>
      </tr>
    </c:forEach>

Here is what I would like to happen.  When a user enters in a bar code, I need to make a AJAX call to validate that the bar code is valid (is available to be used, is correct for what is being shipped and has not already been used on this order - prevent duplicate scan).

Using DWR for AJAX and that service is all working fine.

The issue is that if the validation fails I would like the focus to return back to the field in question.  That is not happening.  The focus is always going to the next input box.  

I have tried to work with different events: change, blur, keyup etc.  I have tried with placing the focus inline, in the javascript, have tried with jQuery, javascript etc but no luck.

Looking for suggestions/solutions on how to place the focus back to the input box that is causing the issue.

