JSF page set tab order dynamically - javascript

We have requirement to set the tab order dynamically on page based on below conditions.
If field has default value selected then that field should be skipped while user tabs. But if user explicitly clicks on default value field then next tab order should follow correctly by skipping the next default value fields. The fields which needs to be defaulted are decided on page load.

I guess you could dynamically set the tabindex of the input fields, is that what you're trying to accomplish? I'm not sure if tabindex is exposed as a JSF property or not.
http://www.w3schools.com/tags/att_global_tabindex.asp

Related

Set the value of jplist-drop-down after reloading

I have a jplist dropdown list to change the sort field. When changed I am adding the value to php session.
When reloading the page, I would like the value of that field to be the option selected on the sort dropdown list, but cannot find information on how to do it.
Have tried adding class active, selected, set default=true to the field and the remaining to false. All to no avail.
Anyone?
Found out about deepLinking after reading the docs. It´s exactly what I needed.

Dynamically require textbox when "Other" selected from a drop-down

I'm racking my brain trying to figure this out...
I have an ASP.NET web form with some dynamically generated form fields. Depending on what value is chosen in a dropdown list, visibility is set on the following textbox. I do this with a client-side script.
The intent is a user selects "Other" from a dropdownlist, and the "Other Description" field appears next on the form. I'd like to add the ability to activate a requiredfield validator or some kind of validation on the "Other Description" textbox when the textbox is visible.
Any thoughts on how to accomplish this? In my testing postbacks weren't an option, since the form field needs to be on the page so an empty value is associated with it. (Not my choice - I inherited this code from another developer)
The most common approach would be to always render the validator, but render it as disabled and then enable it when desired.
Take a look at the documentation on ASP.NET validators, paying particular attention to the section labelled "Client-Side Validation" and, more specifically, the ValidatorEnable(val, enable) function.
ValidatorEnable(val, enable) Takes a client-validator and a Boolean
value. Enables or disables a client validator. Being disabled will
stop it from evaluating and it will always appear valid.
Note that the val parameter is the validator element, not a string ID.

Maintain State on Server or in Hidden Fields?

I have 20 items of the same type in a database. Each of the items has a row ID, name, description, and section (A or B).
I have a web page that displays this information and allows the user to change the section attribute for each item. The web page display has a pane for each of the two sections, section A and section B, and each section contains a button and a hidden field for each item in that section. A button's label text is the item's name. The hidden field is used to capture the corresponding item button's section (A or B).
When the user presses one of the item buttons in the section A pane, the button is moved to the section B pane and the button's hidden field is updated to 'B'.
Likewise, when the user presses one of the item buttons in the section B pane, the button is moved to the section A pane and the button's hidden field is updated to 'A'.
At the bottom of the form is a submit button. When the submit button is pressed, all 20 hidden fields containing their associated button's section (A or B) are posted and the php server-side script updates the database for each button accordingly.
In such a case, is it best practice to use AJAX to maintain the state of the items on the server or hidden fields coupled with pure client-side javascript to maintain the state of the items prior to the form post? Why?
Thanks in advance.
In my opinion, it's better user experience to use AJAX and update the section. This saves the user from having to click the submit button after all selections have been made. Also, much simpler because you don't need to store these prior states in a hidden field or in session. You can just do the update in real time.

How to improve the onChange attribute to effect the changes after browser refresh?

I have a dynamic form which depending on the value in a pull down selection field will either show or hide a form fieldset.
e.g. Do you wish to get a quote just now? [YES/NO]
This works fine the way it is at the moment however there is a limitation when the user refreshes the form and the value is still intact however the changes that should have made an effect on the document are not shown. i.e. it is reset to its original state
The only way to remedy this is to redo the selection in that form field i.e. (reclick Yes/No).
Is there anyway I can workaround this problem? Perhaps a seperate javascript that checks the value of that field?
How would you tackle it?
Thanks
A refresh reinitialises the page so will reset everything that the browser doesn't remember for you. The only way would be to store the value in a session/cookie and read it each time the page is loaded to check if the fieldset should be shown on hidden.

Controlling dynamically added fields' tabbing order with Prototype

I'm creating various input fields dynamically using prototype js. Everything looks nice and cool and the fields are appended properly in the right place.
The only problem is that the field's tabbing order is messed up ...
When inside a textfield pressing tab doesn't switch focus to the field immediately below it.
Instead it gives focus to inputs that existed before the new fields were dynamically added ...
Is there a clean and simple way to reset the field's tabbing order to the regular one, i.e. the one that would switch to the field immediately after in the DOM .
Note : this annoyance occured on Firefox 5.0. I didn't test it on other browsers yet.
You can manually set the tab index. The issue here is that the logical order of fields any given HTML does not always match the visual order of those fields in the browser. So writing a script to automate this may not always work.
According to W3C forms,
Those elements that assign a positive value to [tabindex] are navigated first
... Elements that have identical tabindex values should be navigated in the order they appear in the character stream.
So give all the dynamic fields the same value of 1 and they will be tabbed before any other field (which have an equivalent value of 0) in the order they are added to the document.

Categories