Bootstrap Snippet jQuery Parent check box select child check box will select using HTML CSS Javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
 <div class="near_by_hotel_wrapper">
                            <div class="near_by_hotel_container">
                                <table id="tableOne" class="table no-border custom_table dataTable no-footer dtr-inline">
                                    <thead>
                                        <tr>                        
                                            <th><input type="checkbox" /></th>
                                            <th>Name</th>
                                            <th>English</th>
                                            <th>Spanish</th>
                                            <th>Digital</th>
                                            <th>Mandatory</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><input type="checkbox" /></td>
                                            <td>Bob Smith</td>
                                            <td>Test </td>
                                            <td>Test</td>
                                            <td>Test</td>
                                            <td>Test</td>
                                        </tr>
                                        <tr>
                                            <td><input type="checkbox" /></td>
                                            <td>George Jones</td>
                                            <td>Test</td>
                                            <td>Test</td>
                                            <td>Test</td>
                                            <td>Test</td>
                                        </tr>
                                        <tr>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
/*============ header style ============*/
body {
    background:#f6f6f6;
    overflow-x:hidden;
}
.page-title{
    background: #e7e7e7 none repeat scroll 0 0;
    border: 1px solid #c1c1c1;
    font-weight: 100;
    margin: 0;
    padding: 15px 0;
}
.widget {
    background: #ececec none repeat scroll 0 0;
    border: 1px solid #adadad;
    border-radius: 5px 5px 0 0;
    margin: 20px 0;
    padding: 0;
}
.widget-title {
    background: #e4e4e4 none repeat scroll 0 0;
    border-radius: 5px 5px 0 0;
    font-size: 22px;
    font-weight: 100;
    margin: 0;
    padding: 15px 0;
    text-transform: uppercase;
}
.add-remove-class{
    margin:15px 0px;
}
.show-more-snippet {
    height:35px;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
$("#tableOne thead tr th:first input:checkbox").click(function () {
    var checkedStatus = this.checked;
    $("#tableOne tbody tr td:first-child input:checkbox").each(function () {
        this.checked = checkedStatus;
    });
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"jQuery Parent check box select child check box will select"
Bootstrap 3.0.0 Snippet by Biplab01198

Related: See More

Questions / Comments:

"jQuery Parent check box select child check box will select" Bootstrap 3.0.0 Snippet by Biplab01198

Related: See More

Questions / Comments:

"jQuery Parent check box select child check box will select"
Bootstrap 3.0.0 Snippet by Biplab01198