Condition:
I have two radio button with the same name . On click(event) on the first radio button i need to enable the first textbox and Similarly On click(event) on the second radio button i need to disable the first and enable the second textbox.
Steps:
1. Include the jquery file
2. Create the form
->
3. Fire the action on click event or change event.
-> On document ready disable both the text box
jQuery(document).ready(function () { //$(function(){.. )};
$("input:text[name='edate']").attr("disabled", true);
$("input:text[name='edatefrom']").attr("disabled", true);
$("input:text[name='edateto']").attr("disabled", true);
)};
-> On click on the first radio button Enable the first textbox and disable the others
$("#eventselectone").click(function(){
$("input:text[name='edate']").removeAttr("disabled");
$("input:text[name='edateto']").attr("disabled", true);
$("input:text[name='edatefrom']").attr("disabled", true);
});
->Simlarly on click on the second radio button Disable the first textbox and viceversa.
Sample Code
-form-
-table-
Choose | input type="radio" name="eventselect" id="eventselectone" - Single Event - input type="radio" name="eventselect" id="eventselectrange" - Range Event |
Date: | - input type="text" name="edate" class="one" value="" - |
Btn: | -input type="text" name="edateto" class="one" value="" || -input type="text" name="edatefrom" class="one" value="" - |
-input type="submit" name="add_events" value="++ Event" - |
Similar Example Click Me
Similar Example