0

I want to uncheck checkbox based on unselection of another check box. ex.

    <input id=isActive_1 type=checkbox />
<input id=isActive_2 type=checkbox />
<input id=isActive_3 type=checkbox />


    <input id=publish_1 type=checkbox />
<input id=publish_2 type=checkbox />
<input id=publish_3 type=checkbox />

when i uncheck 'isActive_1' then 'publish_1' should be unchecked at this time. Please help me out

1
  • if you select both isActive_1 and isActive_2 what will happen? Commented Apr 12, 2013 at 7:17

5 Answers 5

2

See this: Fiddle

$('input[id^=isActive_]').change(function () {
   $("input[id^=publish" + this.id.replace('isActive', '') + "]").attr('checked', this.checked);
});
Sign up to request clarification or add additional context in comments.

Comments

0

You can use this:

$(document).ready(function(){
    $("input#isActive_1").click(function(){
        if(!$("input#isActive_1").prop("checked"))
          $("input#publish_1").prop("checked", false);
        else
          $("input#publish_1").prop("checked", true);
    });
});

Fiddle: http://jsfiddle.net/praveenscience/uJxL8/


Updated from comment

Use regex selectors this way:

$(document).ready(function(){
    $("[id^=isActive_]").click(function(){
        /////
    });
});

2 Comments

but i don't know which which isActive check box well be deselected . i want to get it dynamic. ie. if i have 20 isActive checkbox then i will not check manullay
@user1280492 Check the fiddle.
0

First of all use double quotes for attribute values, and use the id of isActive_ checkboxes to get the index of publish_

Live Demo

Html

<input id="isActive_1" type="checkbox" />
<input id="isActive_2" type="checkbox" />
<input id="isActive_3" type="checkbox" />
<input id="publish_1" type="checkbox" />
<input id="publish_2" type="checkbox" />
<input id="publish_3" type="checkbox" />

Javascript

$('[id^=isActive_]').change(function () {
    $('#publish_' + this.id.replace('isActive_', '')).attr('checked', this.checked);
});

1 Comment

This acts on checking and on unchecking. OP asked only for an unchecking action so have to suspect a test is necessary.
0

You should try this: JSFiddle

$(function() {
    $(document).on("click", "input[id^='isActive_']", function() {
        var number = +$(this).attr("id").substring(9);
        var checked = $(this).prop("checked");

        // for checking & unchecking behaviour
        //$("#publish_"+number).prop("checked", checked);

        if(!checked) {
            $("#publish_"+number).prop("checked", false);
        }
    });
});

(or with "change" event)

You can now add as many checkboxes as you like and even dynamically (e.g. after page is loaded & JavaScript executed - from AJAX)

1 Comment

This acts on checking and on unchecking. OP asked only for an unchecking action so have to suspect a test is necessary.
0
$("input#isActive_1").click(function(){
 if($('input#isActive_1:checked').length > 0)
   $('input#publish_1').attr('checked', true);
 else
   $('input#publish_1').attr('checked', false);
});

Edit : Wrong test to know if "isActive_1" checkbox is checked or not on first time.

1 Comment

Dude, attr is not the one to use!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.