Correcting the Tab Index – Siebel Open UI

Imagine that you have a view where you have several form applets stacked vertically. You would like to allow users to be able to navigate from top to bottom using keyboard (Tab Key). Where you would like to skip read only fields, mvg fields and some other fields.

This requirement is not possible in using normal field indexing capability provided by Siebel in Siebel Tools. I had this type of situation and I came up with a small piece of code when plugged in View PR would add Tab Index attributes to the form fields that are active and allow seamless navigation across applets on the view. You can put your custom logic to vary the tab index for different sections or fields.

Below is the code that should be put in View PR SetRenderer function

var tabindex = 1;
//add the selectors depending on your needs (text area, radio etc)
$("input[type='text'], input[type='checkbox'], button").each(function() {
     //put the filter condition or custom logic to vary tab index for fields
     //in this example we skip read only fields, and any thing that has disabled attribute (buttons) to it
     if ($(this).attr("aria-readonly") === "true" || $(this).attr("disabled") === "disabled") {
        $(this).attr("tabindex", "-1"); //no need for focus on these fields
     }
     else{
         $(this).attr("tabindex", tabindex); //assign the index using tabindex attribute
         tabindex++; //increment tab index
    }
});

A little tid bit that can come in handy while you are working on Siebel Open UI.