Single Article

Move cursor automatically into another text field

Category APEX and jQuery

JavaScript code updated on 25.10.2011

Here is how you can move cursor automatically into another text field when field max length is reached.

I did find this instruction and modified it a bit for APEX. See an example here.

 

Create HTML region and text items FIELD_1, FIELD_2 and FIELD_3.

Set items HTML Form Element Attributes

tabindex="1"

 

Chang the value of tabindex according to the item order.

Then in HTML region footer

<script type="text/javascript">
$(function(){
 $('##REGION_ID# input:not([type="hidden"])').keyup(function(evt){
  if(this.value.length===this.maxLength&&evt.which>=48){
   n=this.tabIndex;
   evt.preventDefault();
   if(n<$('##REGION_ID# input:not([type="hidden"])').length){
    $('##REGION_ID# input:not([type="hidden"])').eq(n).focus();
   }
   if(n==$('##REGION_ID# input:not([type="hidden"])').length){
    $('##REGION_ID# input:not([type="hidden"])').eq(0).focus();
   }
  }
 });
});
</script>

 

This example needs jQuery. You can load jQuery on page HTML header if you use APEX version below 4.0. In APEX 4.0 jQuery is integrated.

 

Comments

No comments yet on this article.

Global Right Column

Search

Archives

Subscribe in a Reader