JavaScript for a checkbox

Question

I have a dropDown with two items itemA and itemB and two checkBox below named chkBoxA and chkBoxB if the item in the dropdown selected is itemA either of the checkBoxes(chkBoxA and chkBoxAB) should be selected(like a radio button) but not both Can someone please help me with the jaascript.

Abhijeet Jadhav · Answer

Hi Mansoor, Pl try below code. "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" > "itemList" name= "task_for" > "1" >itemA "2" >itemB "checkbox" name= "itm[]" class = "checkvalue" value= "1" >itemA "checkbox" name= "itm[]" class = "checkvalue" value= "2" >itemB $( function () { $( '#itemList' ).change( function () { var val = $( this ).val(); $( 'input[name="itm[]"]' ).prop( 'checked' , false ); $( "input.checkvalue" ).prop( "disabled" , ! this .checked); $( 'input[name="itm[]"][value=' + val + ']' ).prop( 'checked' , true ); }); });

Abhijeet Jadhav · Answer

@Bidyasagar : Code you provided will not fulfill the requirement as checkboxes are not behaving like radio button. @Mansoor: Can you try below code and see if this suffice. "ddlItems" onchange= "GetSelectedTextValue(this)" > "" >Select "1" >Item A "2" >Item B "checkbox" id= "chkA" > "checkbox" id= "chkB" > "text/javascript" > function GetSelectedTextValue(ddlItems) { var selectedValue = ddlItems.value; if (selectedValue==1){ //Enable Checkbox document.getElementById( "chkA" ).disabled = false ; document.getElementById( "chkB" ).disabled = false ; document.getElementById( "chkB" ).checked = false ; document.getElementById( "chkB" ).disabled = true ; document.getElementById( "chkA" ).checked = true ; } else if (selectedValue==2){ //Enable Checkbox document.getElementById( "chkA" ).disabled = false ; document.getElementById( "chkB" ).disabled = false ; document.getElementById( "chkA" ).checked = false ; document.getElementById( "chkA" ).disabled = true ; document.getElementById( "chkB" ).checked = true ; } else { //Enable Checkbox document.getElementById( "chkA" ).disabled = false ; document.getElementById( "chkB" ).disabled = false ; document.getElementById( "chkA" ).checked = false ; document.getElementById( "chkB" ).checked = false ; } } There is a scope of improvement however this is working as per requirement.

Bidyasagar Mishra · Answer

Hi Manssor, Did you get any fruitfull result from my answer?

Bidyasagar Mishra · Answer

Hi Mansoor, check the below code . The below code is in pure javascript and its working as per your requirement. "ddlItems" onchange= "GetSelectedTextValue(this)" > "" >Select "1" >Item A "2" >Item B "checkbox" id= "chkA" > "checkbox" id= "chkB" > "text/javascript" > function GetSelectedTextValue(ddlItems) { var selectedValue = ddlItems.value; if (selectedValue==1){ document.getElementById( "chkB" ).checked = false ; document.getElementById( "chkA" ).checked = true ; } else if (selectedValue==2){ document.getElementById( "chkA" ).checked = false ; document.getElementById( "chkB" ).checked = true ; } else { document.getElementById( "chkA" ).checked = false ; document.getElementById( "chkB" ).checked = false ; } }

Mansoor Mohammed · Answer

Thanks u Abijeet, can u please provide the same in javascript, not in jQuery

JavaScript for a checkbox

Insert Link

Embed YouTube Video

Table Options

Insert Image

Answers (5)