jQuery Slider example
This is an example to use jQuery Slider and synchronize the value of slider with the database using server side program.
- Access and work the example
- Testing automation
In order to access this example, please access the url below or "jQuery Slider" link from the top page.
Then the page below will appear.
This example uses 3 sliders. The value of slider changes, it access the server program and synchoronize the data, by using ajax.
The source code is in the "ALINOUS_HOME/samples/slider/" folder.
In order to change the theme of jQuery, please take a look at jQuery Dialog. The way to do that is same.
At first, put the html code to apply JQuery slider plugin.
This sample has 3 sliders and there are 3 div tags to be the slider widgets.
Set up the jQuery slider widget and event handler which is called when the slider's value changed.
When the slider widget changing value, the "refreshSwatch" function called. When the sliding finished, the "refreshSwatch" function and noname function difined at the last of this source code is fired. The jQuery plugin can have multiple event handler for a single event.
In this event handler, it has 2 arguments, they are "event" and "ui". By using them, you can get necessary information to synchronize the data in the server side program.
This server side program is dummy.
But by settting break point of the debugger, you can watch the parameters sent via Ajax.
The "$IN.targetId" indicates which slider is changed, and the "$IN.targetValue" does the value.
This example is testable code, there is more example to do testing automation. Please take a look at Testing jQuery Slider example.