Custom PS3 firmware released | Games Industry | MCV
Tuesday, January 11, 2011
HTML Radio Buttons and JavaScript
Here is a quick tutorial that shows how to read the selected value or selected index from a group of radio buttons using JavaScript.
I present the sample within the DeveloperCaster namespace (like all the samples in this blog); however, I decided to create a sub namespace for Forms so we will access these functions by calling DeveloperCaster.Forms.
var DeveloperCaster = {
Forms: {
}
}
Finding the selected index
The function goes straight to the point. We check if it is a valid object otherwise we return -1; then, we loop through every object in the collection until we find the checked item to return the index (-1 will be returned if no item is checked).
RadioSelectedIndex: function (id) {
if (typeof ($(id).length) != 'undefined') {
var index = -1;
var _obj = $(id);
for (var i = 0; i < _obj.length; i++) {
if (_obj[i].checked) {
index = i;
break;
}
}
return index;
}
return -1;
}
Finding the selected value
This function simply utilizes our previous function; so, we check if the selected index is not equal to -1 and then return the selected index value.
RadioSelectedValue: function (id) {
var index = DeveloperCaster.Forms.RadioSelectedIndex(id);
if (index != -1) {
return $(id)[index].value;
}
return "";
}
Here is the complete set of functions:
var DeveloperCaster = {
Forms: {
RadioSelectedIndex: function (id) {
if (typeof ($(id).length) != 'undefined') {
var index = -1;
var _obj = $(id);
for (var i = 0; i < _obj.length; i++) {
if (_obj[i].checked) {
index = i;
break;
}
}
return index;
}
return -1;
},
RadioSelectedValue: function (id) {
var index = DeveloperCaster.Forms.RadioSelectedIndex(id);
if (index != -1) {
return $(id)[index].value;
}
return "";
}
}
}
Usage
Note: Tutorial for the AddEvent function can be found here.
Compress this code here: http://www.jscompressor.com/
Usage
Note: Tutorial for the AddEvent function can be found here.
<html>
<head>
<script language=”javascript”>
window.onload = function () {
DeveloperCaster.AddEvent('btnValue', 'click', function () {
alert(DeveloperCaster.Forms.RadioSelectedValue('group1'));
});
DeveloperCaster.AddEvent('btnIndex', 'click', function () {
alert(DeveloperCaster.Forms.RadioSelectedIndex('group1'));
});
}
</script>
</head>
<body>
<input type="radio" name="group1" value="One"> One<br>
<input type="radio" name="group1" value="Two" checked>Two<br>
<input type="radio" name="group1" value="Three"> Three
<br />
<input type="button" name="btnValue" value="Selected Value" />
<input type="button" name="btnIndex" value="Selected Index" />
</body>
</html>
Compress this code here: http://www.jscompressor.com/
Motorola Xoom Table
This year's CES was about Tablet's and the Motorola Xoom running Android 3.0 was one of the better ones shown at the show.
What they are saying around the Web:
Tuesday, December 14, 2010
Kinect tech firm releases open-source drivers | Game Development | News by Develop
PrimeSense, the company behind the technology used by Microsoft's Kinect device has released open source drivers for both PC and MAC according to various blogs around the web.
Friday, December 10, 2010
Microsoft To Announce Second Major WP7 Update At MWC?
WP7 major updates coming according rumors floating around the web (see here). The updates will be announced during the upcoming Mobile World Congress that will be held between the 14-17 of February 2011, in Barcelona (see here). The updates should bring better controls to developers as well as information about Silverlight 5 for WP7. I am yet to begin working on WP7 but I have been playing with the tools and so far I am impressed.
Subscribe to:
Posts (Atom)