EXAMPLE: The setNodeValue Method VIEW SOURCE

This example demonstrates how the setNodeValue instance method of the Uize.Widget base class can be used to conveniently set the value of various different types of element nodes, including form inputs. In this example, the "value" is being set in a single call to the setNodeValue instance method for a select node, a checkbox input, a radio button set, a text input, a textarea input, and a span node. Setting the value for all the nodes in a single call is accomplished by supplying the setNodeValue method with a node "blob".

A value property does not exist, per se, for all of the element types mentioned. So, the concept of a value is provided as an abstraction to ease interfacing with these different element types, making it easier to contemplate swapping one type for another without having to change the way in which one's application logic addresses the elements.

Use the two buttons below to invoke the setNodeValue method to set the value for all of the elements to either true or false. You can, of course, use any values with this method, but a boolean was chosen for this example in order to demonstrate the method with a checkbox input as well. Notice how setting the "value" of the span node essentially sets its innerHTML.

Set all to false Set all to true
a select tag
a checkbox
radio buttons  
a text input
a text area
a span