If all the Child Category check-boxes are Selected Then Parent checkbox Should be selected AutomaticallyHow do you remove all the options of a select box and then add one option and select it with jQuery?How to implement “select all” check box in HTML?How to change class on parent class when checkbox is checked with javascript?Select / Clone parent of child class - append text to various attributes within parent and appendTo / insertAfter resultCannot display HTML stringParent checkbox inputs are checked when thei children inputs becomes checked. iCheck PluginHow to select parent checkboxes when no way to edit HTML?Nested GridViews Select All Checkboxes in nested grid from parent gridCreate a HTML span as a text using java / javascriptjQuery - Sending “Select All” Check boxes with Multiple Forms
Got a new frameset, don't know why I need this split ring collar?
How can I ping multiple IP addresses at the same time?
Operator currying: how to convert f[a,b][c,d] to a+c,b+d?
How to make all magic-casting innate, but still rare?
How did Frodo know where the Bree village was?
How can caller ID be faked?
writing a function between sets vertically
How to ask if I can mow my neighbor's lawn
My student in one course asks for paid tutoring in another course. Appropriate?
Justifying Affordable Bespoke Spaceships
How did the European Union reach the figure of 3% as a maximum allowed deficit?
What is the precise meaning of "подсел на мак"?
How to address players struggling with simple controls?
How can I prevent a user from copying files on another hard drive?
How could I create a situation in which a PC has to make a saving throw or be forced to pet a dog?
Would a 7805 5v regulator drain a 9v battery?
What kind of chart is this?
How do I gain the trust of other PCs?
Co-worker is now managing my team. Does this mean that I'm being demoted?
Is there a polite way to ask about one's ethnicity?
What does this Swiss black on yellow rectangular traffic sign with a symbol looking like a dart mean?
How can I maintain game balance while allowing my player to craft genuinely useful items?
Why "amatus est" instead of "*amavitur"
Is there any possible way to get these hearts as Adult Link?
If all the Child Category check-boxes are Selected Then Parent checkbox Should be selected Automatically
How do you remove all the options of a select box and then add one option and select it with jQuery?How to implement “select all” check box in HTML?How to change class on parent class when checkbox is checked with javascript?Select / Clone parent of child class - append text to various attributes within parent and appendTo / insertAfter resultCannot display HTML stringParent checkbox inputs are checked when thei children inputs becomes checked. iCheck PluginHow to select parent checkboxes when no way to edit HTML?Nested GridViews Select All Checkboxes in nested grid from parent gridCreate a HTML span as a text using java / javascriptjQuery - Sending “Select All” Check boxes with Multiple Forms
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;
1
Here is my code: I've created the checkboxes for parent and child. I'm looking for Javascript validation for the below code. When I select the single child the parent checkbox is selecting but I'want to select all the child checkboxes then only the parent should select.
<label>Product Category:</label>
<div class="wk_field wk_category">
<div class="wk_for_validation">
<div id="wk_category_label">CATEGORIES</div>
<div class="wk_cat_container" style="margin-left:0px;">
<span class="wk_minus"> </span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Gold</span>
<input class="wk_elements" type="checkbox" value="3" name="category[]" id="3">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_no"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Earrings</span>
<input class="wk_elements" type="checkbox" value="27" name="category[]" data-parent=3 >
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Rings</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">bangles</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
var cb_list = document.getElementsByTagName('input');
for (var i = 0, len = cb_list.length; i < len; i++)
if (cb_list[i].type === 'checkbox')
cb_list[i].onclick = function(i)
return function()
checkParent(this);
(i);
function checkParent(ele)
var idparent = ele.getAttribute('data-parent');
if (idparent)
var parent = document.getElementById(idparent);
if (ele.checked === true) parent.checked = true;
checkParent(parent);
javascript html
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
add a comment |
1
Here is my code: I've created the checkboxes for parent and child. I'm looking for Javascript validation for the below code. When I select the single child the parent checkbox is selecting but I'want to select all the child checkboxes then only the parent should select.
<label>Product Category:</label>
<div class="wk_field wk_category">
<div class="wk_for_validation">
<div id="wk_category_label">CATEGORIES</div>
<div class="wk_cat_container" style="margin-left:0px;">
<span class="wk_minus"> </span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Gold</span>
<input class="wk_elements" type="checkbox" value="3" name="category[]" id="3">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_no"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Earrings</span>
<input class="wk_elements" type="checkbox" value="27" name="category[]" data-parent=3 >
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Rings</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">bangles</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
var cb_list = document.getElementsByTagName('input');
for (var i = 0, len = cb_list.length; i < len; i++)
if (cb_list[i].type === 'checkbox')
cb_list[i].onclick = function(i)
return function()
checkParent(this);
(i);
function checkParent(ele)
var idparent = ele.getAttribute('data-parent');
if (idparent)
var parent = document.getElementById(idparent);
if (ele.checked === true) parent.checked = true;
checkParent(parent);
javascript html
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
1
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34
add a comment |
1
1
1
Here is my code: I've created the checkboxes for parent and child. I'm looking for Javascript validation for the below code. When I select the single child the parent checkbox is selecting but I'want to select all the child checkboxes then only the parent should select.
<label>Product Category:</label>
<div class="wk_field wk_category">
<div class="wk_for_validation">
<div id="wk_category_label">CATEGORIES</div>
<div class="wk_cat_container" style="margin-left:0px;">
<span class="wk_minus"> </span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Gold</span>
<input class="wk_elements" type="checkbox" value="3" name="category[]" id="3">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_no"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Earrings</span>
<input class="wk_elements" type="checkbox" value="27" name="category[]" data-parent=3 >
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Rings</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">bangles</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
var cb_list = document.getElementsByTagName('input');
for (var i = 0, len = cb_list.length; i < len; i++)
if (cb_list[i].type === 'checkbox')
cb_list[i].onclick = function(i)
return function()
checkParent(this);
(i);
function checkParent(ele)
var idparent = ele.getAttribute('data-parent');
if (idparent)
var parent = document.getElementById(idparent);
if (ele.checked === true) parent.checked = true;
checkParent(parent);
javascript html
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
Here is my code: I've created the checkboxes for parent and child. I'm looking for Javascript validation for the below code. When I select the single child the parent checkbox is selecting but I'want to select all the child checkboxes then only the parent should select.
<label>Product Category:</label>
<div class="wk_field wk_category">
<div class="wk_for_validation">
<div id="wk_category_label">CATEGORIES</div>
<div class="wk_cat_container" style="margin-left:0px;">
<span class="wk_minus"> </span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Gold</span>
<input class="wk_elements" type="checkbox" value="3" name="category[]" id="3">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_no"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Earrings</span>
<input class="wk_elements" type="checkbox" value="27" name="category[]" data-parent=3 >
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">Rings</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
<div class="wk_removable wk_cat_container" style="margin-left: 20px;">
<span class="wk_minusend"></span>
<span class="wk_foldersign"></span>
<span class="wk_elements wk_cat_name">bangles</span>
<input class="wk_elements" type="checkbox" value="26" name="category[]" data-parent=3 id="26">
</div>
var cb_list = document.getElementsByTagName('input');
for (var i = 0, len = cb_list.length; i < len; i++)
if (cb_list[i].type === 'checkbox')
cb_list[i].onclick = function(i)
return function()
checkParent(this);
(i);
function checkParent(ele)
var idparent = ele.getAttribute('data-parent');
if (idparent)
var parent = document.getElementById(idparent);
if (ele.checked === true) parent.checked = true;
checkParent(parent);
javascript html
javascript html
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
edited Mar 25 at 5:26
KRISHNA CHAITANYA RYALI
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
asked Mar 25 at 5:08
KRISHNA CHAITANYA RYALIKRISHNA CHAITANYA RYALI
64
64
1
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34
add a comment |
1
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34
1
1
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34
add a comment |
2 Answers
2
active
oldest
votes
0
Note: This is in jQuery
/* Single checkbox at top to select all child checkboxs */
$('#parent_checkbox').on('click', function ()
if (this.checked)
$('.child_check').each(function ()
this.checked = true;
);
else
$('.child_check').each(function ()
this.checked = false;
);
);
/* check all child checkbox are selected to select the parent checkbox */
$(document).on('click', '.child_check', function ()
if ($('.child_check:checked').length === $('.child_check').length)
$('#parent_checkbox').prop('checked', true);
else
$('#parent_checkbox').prop('checked', false);
);
answered Mar 25 at 6:35
KrishnaKrishna
414
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
add a comment |
0
Javascript
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table style="width:100%">
<tr>
<td><input type="checkbox" name="selectall" id="parent_checkbox" class="selectall"/></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="1" class="child_check" value="1" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="2" class="child_check" value="2" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="3" class="child_check" value="3" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="4" class="child_check" value="4" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="5" class="child_check" value="5" onclick="check()" /></td>
</tr>
</table>
</body>
<script type="text/javascript">
function check()
var checkbox = document.getElementsByName('ckbox[]');
var ln = 0;
for(var i=0; i< checkbox.length; i++) //check for child checkboxes
if(checkbox[i].checked)
ln++
//select parent if all child are checked
var all = document.getElementsByName('ckbox[]');
var num = all.length;
if(ln == num)
document.getElementById("parent_checkbox").checked = true;
else
document.getElementById("parent_checkbox").checked = false;
</script>
</html>
answered Mar 25 at 11:55
KrishnaKrishna
414
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55331539%2fif-all-the-child-category-check-boxes-are-selected-then-parent-checkbox-should-b%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
Note: This is in jQuery
/* Single checkbox at top to select all child checkboxs */
$('#parent_checkbox').on('click', function ()
if (this.checked)
$('.child_check').each(function ()
this.checked = true;
);
else
$('.child_check').each(function ()
this.checked = false;
);
);
/* check all child checkbox are selected to select the parent checkbox */
$(document).on('click', '.child_check', function ()
if ($('.child_check:checked').length === $('.child_check').length)
$('#parent_checkbox').prop('checked', true);
else
$('#parent_checkbox').prop('checked', false);
);
answered Mar 25 at 6:35
KrishnaKrishna
414
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
add a comment |
0
Note: This is in jQuery
/* Single checkbox at top to select all child checkboxs */
$('#parent_checkbox').on('click', function ()
if (this.checked)
$('.child_check').each(function ()
this.checked = true;
);
else
$('.child_check').each(function ()
this.checked = false;
);
);
/* check all child checkbox are selected to select the parent checkbox */
$(document).on('click', '.child_check', function ()
if ($('.child_check:checked').length === $('.child_check').length)
$('#parent_checkbox').prop('checked', true);
else
$('#parent_checkbox').prop('checked', false);
);
answered Mar 25 at 6:35
KrishnaKrishna
414
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
add a comment |
0
0
0
Note: This is in jQuery
/* Single checkbox at top to select all child checkboxs */
$('#parent_checkbox').on('click', function ()
if (this.checked)
$('.child_check').each(function ()
this.checked = true;
);
else
$('.child_check').each(function ()
this.checked = false;
);
);
/* check all child checkbox are selected to select the parent checkbox */
$(document).on('click', '.child_check', function ()
if ($('.child_check:checked').length === $('.child_check').length)
$('#parent_checkbox').prop('checked', true);
else
$('#parent_checkbox').prop('checked', false);
);
answered Mar 25 at 6:35
KrishnaKrishna
414
Note: This is in jQuery
/* Single checkbox at top to select all child checkboxs */
$('#parent_checkbox').on('click', function ()
if (this.checked)
$('.child_check').each(function ()
this.checked = true;
);
else
$('.child_check').each(function ()
this.checked = false;
);
);
/* check all child checkbox are selected to select the parent checkbox */
$(document).on('click', '.child_check', function ()
if ($('.child_check:checked').length === $('.child_check').length)
$('#parent_checkbox').prop('checked', true);
else
$('#parent_checkbox').prop('checked', false);
);
answered Mar 25 at 6:35
KrishnaKrishna
414
answered Mar 25 at 6:35
KrishnaKrishna
414
answered Mar 25 at 6:35
KrishnaKrishna
414
answered Mar 25 at 6:35
KrishnaKrishna
414
414
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
add a comment |
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
Hi, thank you for your time and patience. Can you do it in javascript.
– KRISHNA CHAITANYA RYALI
Mar 25 at 8:37
add a comment |
0
Javascript
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table style="width:100%">
<tr>
<td><input type="checkbox" name="selectall" id="parent_checkbox" class="selectall"/></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="1" class="child_check" value="1" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="2" class="child_check" value="2" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="3" class="child_check" value="3" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="4" class="child_check" value="4" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="5" class="child_check" value="5" onclick="check()" /></td>
</tr>
</table>
</body>
<script type="text/javascript">
function check()
var checkbox = document.getElementsByName('ckbox[]');
var ln = 0;
for(var i=0; i< checkbox.length; i++) //check for child checkboxes
if(checkbox[i].checked)
ln++
//select parent if all child are checked
var all = document.getElementsByName('ckbox[]');
var num = all.length;
if(ln == num)
document.getElementById("parent_checkbox").checked = true;
else
document.getElementById("parent_checkbox").checked = false;
</script>
</html>
answered Mar 25 at 11:55
KrishnaKrishna
414
add a comment |
0
Javascript
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table style="width:100%">
<tr>
<td><input type="checkbox" name="selectall" id="parent_checkbox" class="selectall"/></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="1" class="child_check" value="1" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="2" class="child_check" value="2" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="3" class="child_check" value="3" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="4" class="child_check" value="4" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="5" class="child_check" value="5" onclick="check()" /></td>
</tr>
</table>
</body>
<script type="text/javascript">
function check()
var checkbox = document.getElementsByName('ckbox[]');
var ln = 0;
for(var i=0; i< checkbox.length; i++) //check for child checkboxes
if(checkbox[i].checked)
ln++
//select parent if all child are checked
var all = document.getElementsByName('ckbox[]');
var num = all.length;
if(ln == num)
document.getElementById("parent_checkbox").checked = true;
else
document.getElementById("parent_checkbox").checked = false;
</script>
</html>
answered Mar 25 at 11:55
KrishnaKrishna
414
add a comment |
0
0
0
Javascript
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table style="width:100%">
<tr>
<td><input type="checkbox" name="selectall" id="parent_checkbox" class="selectall"/></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="1" class="child_check" value="1" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="2" class="child_check" value="2" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="3" class="child_check" value="3" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="4" class="child_check" value="4" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="5" class="child_check" value="5" onclick="check()" /></td>
</tr>
</table>
</body>
<script type="text/javascript">
function check()
var checkbox = document.getElementsByName('ckbox[]');
var ln = 0;
for(var i=0; i< checkbox.length; i++) //check for child checkboxes
if(checkbox[i].checked)
ln++
//select parent if all child are checked
var all = document.getElementsByName('ckbox[]');
var num = all.length;
if(ln == num)
document.getElementById("parent_checkbox").checked = true;
else
document.getElementById("parent_checkbox").checked = false;
</script>
</html>
answered Mar 25 at 11:55
KrishnaKrishna
414
Javascript
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table style="width:100%">
<tr>
<td><input type="checkbox" name="selectall" id="parent_checkbox" class="selectall"/></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="1" class="child_check" value="1" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="2" class="child_check" value="2" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="3" class="child_check" value="3" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="4" class="child_check" value="4" onclick="check()" /></td>
</tr>
<tr>
<td><input type="checkbox" name="ckbox[]" id="5" class="child_check" value="5" onclick="check()" /></td>
</tr>
</table>
</body>
<script type="text/javascript">
function check()
var checkbox = document.getElementsByName('ckbox[]');
var ln = 0;
for(var i=0; i< checkbox.length; i++) //check for child checkboxes
if(checkbox[i].checked)
ln++
//select parent if all child are checked
var all = document.getElementsByName('ckbox[]');
var num = all.length;
if(ln == num)
document.getElementById("parent_checkbox").checked = true;
else
document.getElementById("parent_checkbox").checked = false;
</script>
</html>
answered Mar 25 at 11:55
KrishnaKrishna
414
answered Mar 25 at 11:55
KrishnaKrishna
414
answered Mar 25 at 11:55
KrishnaKrishna
414
answered Mar 25 at 11:55
KrishnaKrishna
414
414
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55331539%2fif-all-the-child-category-check-boxes-are-selected-then-parent-checkbox-should-b%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Welcome to SO! Did you make any attempts to achieve what you want? Your question looks more like a task now.
– flppv
Mar 25 at 5:12
Yes, I've tried this javscript code:var cb_list = document.getElementsByTagName('input'); for (var i=0, len=cb_list.length; i<len; i++) if ( cb_list[i].type === 'checkbox' ) cb_list[i].onclick = function(i) return function() checkParent(this); (i); function checkParent(ele) var idparent = ele.getAttribute('data-parent'); if(idparent) var parent = document.getElementById(idparent); if (ele.checked === true) parent.checked = true; checkParent(parent);
– KRISHNA CHAITANYA RYALI
Mar 25 at 5:19
you can use jstree for this kind of functionality. jstree.com
– pal
Mar 25 at 6:34