|
Jquery и автоматическое выключение чекбоксов при нажатие на любой другой
<!DOCTYPE html>
<html>
<head>
<title>Товары</title>
<meta charset="utf-8">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.4.1.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<script>
jQuery(function ($) {
$(document).on('change', 'input:checkbox', function () {
//if (this.checked) {
if ($(this).is(':checked')) {
var myClass = this.className;
$("." + myClass).not(this).prop('checked', false);
}
});
});
</script>
</head>
<body>
<div class="container-fluid">
<form id="#form_goods" name="form_gooods" method="post" action="">
<div class="row">
<table class="table table-striped table-bordered" id="tgoods">
<thead>
<tr>
<th>Наименование</th>
<th style="text-align: center;">ПН</th>
<th style="text-align: center;">ВТ</th>
<th style="text-align: center;">СР</th>
<th style="text-align: center;">ЧТ</th>
<th style="text-align: center;">ПТ</th>
</tr>
</thead>
<tbody>
<tr id="1">
<td>Пирог балканский</td>
<td style="text-align: center;">
<input class="mon" style="margin-right: 10px;" type="checkbox" name="rec[1][1]" value="*"></td>
<td style="text-align: center;">
<input class="tue" style="margin-right: 10px;" type="checkbox" name="rec[1][2]" value="*"></td>
<td style="text-align: center;">
<input class="wen" style="margin-right: 10px;" type="checkbox" name="rec[1][3]" value="*"></td>
<td style="text-align: center;">
<input class="thu" style="margin-right: 10px;" type="checkbox" name="rec[1][4]" value="*"></td>
<td style="text-align: center;">
<input class="fri" style="margin-right: 10px;" type="checkbox" name="rec[1][5]" value="*"></td>
</tr>
<tr id="2">
<td>Пирог с сыром</td>
<td style="text-align: center;">
<input class="mon" style="margin-right: 10px;" type="checkbox" name="rec[2][1]" value="*"></td>
<td style="text-align: center;">
<input class="tue" style="margin-right: 10px;" type="checkbox" name="rec[2][2]" value="*"></td>
<td style="text-align: center;">
<input class="wen" style="margin-right: 10px;" type="checkbox" name="rec[2][3]" value="*"></td>
<td style="text-align: center;">
<input class="thu" style="margin-right: 10px;" type="checkbox" name="rec[2][4]" value="*"></td>
<td style="text-align: center;">
<input class="fri" style="margin-right: 10px;" type="checkbox" name="rec[2][5]" value="*"></td>
</tr>
<tr id="3">
<td>Пирог с вареньем</td>
<td style="text-align: center;">
<input class="mon" style="margin-right: 10px;" type="checkbox" name="rec[3][1]" value="*"></td>
<td style="text-align: center;">
<input class="tue" style="margin-right: 10px;" type="checkbox" name="rec[3][2]" value="*"></td>
<td style="text-align: center;">
<input class="wen" style="margin-right: 10px;" type="checkbox" name="rec[3][3]" value="*"></td>
<td style="text-align: center;">
<input class="thu" style="margin-right: 10px;" type="checkbox" name="rec[3][4]" value="*"></td>
<td style="text-align: center;">
<input class="fri" style="margin-right: 10px;" type="checkbox" name="rec[3][5]" value="*"></td>
</tr>
</tbody>
</table>
</div>
</form>
</div> <!-- /container -->
</body>
</html>
Последний раз редактировалось savsoft, 15.02.2020 в 09:03.
|