This tabular form automatically focuses in the next field when a certain number of characters is reached, and adds a new row once it reaches the last column in the last row - as described here: https://forums.oracle.com/forums/thread.jspa?threadID=2519256
- Give the tabular form a static ID. I called this one focus-tabular.
- Create a new dynamic action:
Event: Key Release
Selection Type: jQuery selector
jQuery Selector: #focus-tabular input[type="text"]
- True Action: Execute JavaScript code
Code: (the object columns in the code below specifies the lengths for each column)
var el = this.triggeringElement;
var lastEleName = "f06";
var lastColArr = wwv_flow[lastEleName];
var columns = {
"f03" : 4
, "f04" : 6
, "f05" : 3
, "f06" : 9
};
var input = String.fromCharCode(event.which);
if(el.value.length >= columns[el.name]
&& (/[a-zA-Z0-9-_ ]/.test(input))) {
var lastEle = $(lastColArr).size() >= 2 ? $(lastColArr[lastColArr.length-1]) : $(lastColArr);
if ($(el).is(lastEle)) {
addRow();
}
var baseSelector = '#focus-tabular :input[type="text"]';
var nextElIndex = $(baseSelector).index(el)+1;
$(baseSelector + ':eq(' + nextElIndex +')').focus();
}
- It is important to update the dynamic action and specify the Event Scope as Dynamic, so that and additional rows that are added are still affected.