clear or reset checkbox when clicking tab menu in javascript and php -
i have tab menu this. want checkbox reset when clicking tab menu.
updated full php code find mistaken in code written. search stackoverflow find tab menu checkbox reset solution got solution , implemented code. failed solve problem. please me.
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>event list</title> <link rel="stylesheet" href="<?php echo base_url('asset/css/tabcontent.css'); ?>" type="text/css"/> <script type="text/javascript" src="<?php echo base_url('asset/js/tabcontent.js'); ?>"></script> <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> </head> <body style="text-align:left"> <div class="container"> <div class="row"> <div class="col-lg-12"> <form method="post" action="" > <div class="box"> <legend>add new bundle</legend> <div class="text_box3"> <div> <ul class="tabs" id="tabs" data-persist="true"> <li class="selected"><a href="#view1" onclick="$('#second').prop('checked', false);">all images</a></li> <li><a href="#view2" onclick="$('#first').prop('checked', false);">category</a></li> </ul> <div class="tabcontents"> <div id="view1" style="overflow-y:scroll; height:200px;"> <?php foreach ($get_all_img $row){ echo '<div height="50px"> <label><input type="checkbox" name="first" id="first">'; echo '</label></div>'; } ?> </div> <div id="view2" style="overflow-y:scroll; height:200px;"> <?php foreach($get_everything $tasks){ //echo "<pre>"; //print_r($tasks); echo '<div class="cat_name">'. $tasks['name'].'</div>'; echo "<ul>"; foreach($tasks $task){ foreach($task $p){ foreach($p $pr){ echo '<div height="50px"> <label><input type="checkbox" name="second" id="second">'; echo '</label></div>'; } } }echo "</ul>"; } ?> </div> </div> </div> </div> </div><br> </form> </div> </div> </div> </body> </html>
so can replace code
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>event list</title> <link rel="stylesheet" href="<?php echo base_url('asset/css/tabcontent.css'); ?>" type="text/css"/> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> </head> <body style="text-align:left"> <div class="container"> <div class="row"> <div class="col-lg-12"> <form method="post" action="" > <div class="box"> <legend>add new bundle</legend> <div class="text_box3"> <div> <ul class="nav nav-tabs tabs" id="tabs" data-persist="true"> <li class="selected"><a href="#view1" data-toggle="tab" onclick="$('.second').prop('checked', false);">all images</a></li> <li><a href="#view2" data-toggle="tab" onclick="$('.first').prop('checked', false);">category</a></li> </ul> <div class="tabcontents tab-content"> <div id="view1" class="tab-pane" style="overflow-y:scroll; height:200px;"> <?php foreach ($get_all_img $row){ echo '<div height="50px"> <label><input type="checkbox" name="first" class="first">'; echo '</label></div>'; } ?> </div> <div id="view2" class="tab-pane" style="overflow-y:scroll; height:200px;"> <?php foreach($get_everything $tasks){ //echo "<pre>"; //print_r($tasks); echo '<div class="cat_name">'. $tasks['name'].'</div>'; echo "<ul>"; foreach($tasks $task){ foreach($task $p){ foreach($p $pr){ echo '<div height="50px"> <label><input type="checkbox" name="second" class="second">'; echo '</label></div>'; } } }echo "</ul>"; } ?> </div> </div> </div> </div> </div><br> </form> </div> </div> </div> <script type="text/javascript" src="<?php echo base_url('asset/js/tabcontent.js'); ?>"></script> <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </body> </html>
Comments
Post a Comment