Wijmo UI for the Web
Markup and Scripting
Markup for a wijrating looks similar to this:
| Sample Markup |
Copy Code |
|---|---|
<select id="ratingSelect">
<option value="1">Below Average</option>
<option value="2">Average</option>
<option selected="selected" value="3">Above Average</option>
<option value="4">Awesome</option>
<option value="5">Epic</option>
</select>
| |
Or,
| Sample Markup |
Copy Code |
|---|---|
<div id="ratingRadio">
<label for="input1a">
Below Average</label>
<input type="radio" id="input1a" value="1" name="rating" />
<label for="input2a">
Average</label>
<input type="radio" checked="checked" id="input2a" value="2" name="rating" />
<label for="input3a">
Above Average</label>
<input type="radio" id="input3a" value="3" name="rating" />
<label for="input4a">
Awesome</label>
<input type="radio" id="input4a" value="4" name="rating" />
<label for="input5a">
Epic</label>
<input type="radio" id="input5a" value="5" name="rating" />
</div>
| |
Or,
| Sample Markup |
Copy Code |
|---|---|
<div id="ratingDiv"> </div> | |
The following script initializes the wijrating widget:
| Sample Script |
Copy Code |
|---|---|
<script id="script1" type="text/javascript">
$(document).ready(function () {
$('#ratingSelect').wijrating();
$('#ratingRadio').wijrating();
$('#ratingDiv').wijrating({ value: 4 });
</script>
| |
And of the markup samples and the script featured here results in the following: 