Radio Button Widget
Radio buttons are useful to capture user's either or options. Nedil JS radio widget can be used to create multiple radio buttons in vertical or horizontal layout.
Layout can be "Vertical" or "Horizontal". Default is vertical.

Usage
$.domLoaded(function() {
	
	$.get("#pan").widget("radio", RADIO_ARRAY, LAYOUT);		
	
}
Radio Button Array Options
It contains array of JSON objects. Each JSON will represent a single radio button and it's properties. The properties are mentioned below.
NameTypeMust/OptionalDescription
idStringOptionalSets id of the radio button
nameStringMustSets name of the radio button which can be sent to server. Radio buttons should have common name in a single radio group
valueStringOptionalSets value for the radio button. If not provided, default "on" or "off" will be sent to server
textStringMustText associate to the radio button
enabledBooleanOptionalEnables/Disables a radio button. Default is true (enabled)
selectBooleanOptionalSelects a radio button. Default is false (not selected)

Methods
NameDescription
disable( index )To disable a radio button with specific index in radio group
enable( index )To enable a radio button with specific index in radio group

Radio Button Widget Example
JS HTML
			$.domLoaded( function()  {
				
				// create radio group
				$.get("#cbox1").widget("radio",[
					{id: "cin", name : "rad1", value: "cinema", text : "Cinema", enabled: true},
					{id: "dan", name : "rad1", text : "Dance", enabled: true},
					{id: "mus", name : "rad1", text : "Music", enabled: true}
				]);
				
				$.get("#cbox2").widget("radio",[
					{id: "cin", name : "rad2", value: "cinema", text : "Cinema", enabled: true},
					{id: "dan", name : "rad2", text : "Dance", enabled: true},
					{id: "mus", name : "rad2", text : "Music", enabled: true}
				], "horizontal");	

				$.get("#cbox3").widget("radio",[
					{id: "cin", name : "rad3", value: "cinema", text : "Cinema", enabled: false},
					{id: "dan", name : "rad3", text : "Dance", enabled: false, select: true},
					{id: "mus", name : "rad3", text : "Music", enabled: true}
				], "horizontal");	

				var cb = $.get("#cbox4").widget("radio",[
					{id: "cin", name : "rad4", value: "cinema", text : "Cinema"},
					{id: "dan", name : "rad4", text : "Dance"},
					{id: "mus", name : "rad4", text : "Music"}
				], "horizontal");
				
				// enable / disable
				$.get("#toggle").on("click", function() {
					if(cb.chklist[0].enabled) {
						cb.disable(0);
					} else {
						cb.enable(0);
					}
				});
				
				// select / unselect
				$.get("#select").on("click", function() {
					cb.select(1);
				});
			});
<body>

	Horizontal Layout	<div id="cbox2"></div>
	
	Disabled Radio Buttons	<div id="cbox3"></div>
	
	Enable/Disable and Select/UnSelect	<div id="cbox4"></div>	
	<type="button" id="toggle" value="Enable/Disable"/> <input type="button" id="select" value="Select/Unselect"/>
	
	Vertical Layout	<div id="cbox1"></div>
		
</body>	
Result