05.03.2016, 00:16
|
Аспирант
|
|
Регистрация: 20.02.2015
Сообщений: 54
|
|
Активация checkbox, если значение value из input совпадает
Имею вот такую передачу значения value из checkbox в input с f_select_category. Хотелось бы узнать, реально ли реализовать?
<!DOCTYPE HTML>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class='checkklass'>
<p><input type='checkbox' name='a' value='699'> 4 </p>
<p><input type='checkbox' name='a' value='700'> 5 </p>
<p><input type='checkbox' name='a' value='701'> 6 </p>
<p><input type='checkbox' name='a' value='702'> 7 </p>
<p><input type='checkbox' name='a' value='703'> 8 </p>
<p><input type='checkbox' name='a' value='704'> 9 </p>
<p><input type='checkbox' name='a' value='705'> 10 </p>
<p><input type='checkbox' name='a' value='706'> 11 </p>
<p><input type='checkbox' name='a' value='707'> 12</p>
</div>
<input name="f_select_category" type="text" maxlength="255" size="50" value="" onchange="jQuery.modal.nc_modal_confirm=true;undefined">
<script type="text/javascript">
var check=$("input[name='a']");
check.change(function(){
var names=',';
check.each(function(){if($(this).is(':checked')){names+=$(this).val()+',';}});
$("input[name='f_select_category']").val(names);
});
$("input[name='f_select_category']").val(",");
</script>
</body>
</html>
Как сделать так, что бы checkbox'ы были активированы, если в $("input[name='f_select_category']") будут значения например:
,699,702,703,
|
|
05.03.2016, 00:36
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
k_DizeL,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class='checkklass'>
<p><input type='checkbox' name='a' value='699'> 4 </p>
<p><input type='checkbox' name='a' value='700'> 5 </p>
<p><input type='checkbox' name='a' value='701'> 6 </p>
<p><input type='checkbox' name='a' value='702'> 7 </p>
<p><input type='checkbox' name='a' value='703'> 8 </p>
<p><input type='checkbox' name='a' value='704'> 9 </p>
<p><input type='checkbox' name='a' value='705'> 10 </p>
<p><input type='checkbox' name='a' value='706'> 11 </p>
<p><input type='checkbox' name='a' value='707'> 12</p>
</div>
<input name="f_select_category" type="text" maxlength="255" size="50" >
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
document.querySelector("input[name='f_select_category']").addEventListener("input", function() {
var b = this.value.match(/\d+/g) || [];
[].forEach.call(document.querySelectorAll(".checkklass input"), function(a) {
a.checked = ~b.indexOf(a.value)
})
})
});
</script>
</body>
</html>
|
|
05.03.2016, 01:37
|
Аспирант
|
|
Регистрация: 20.02.2015
Сообщений: 54
|
|
Спасибо конечно. Но в поле input[name='f_select_category'] уже будут какие то значения и их необходимо проверить, после отметить input[name='a'] value которых совпали
Последний раз редактировалось k_DizeL, 05.03.2016 в 01:40.
|
|
05.03.2016, 01:43
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
k_DizeL,
и что это меняет?
|
|
05.03.2016, 01:47
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
k_DizeL,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class='checkklass'>
<p><input type='checkbox' name='a' value='699'> 4 </p>
<p><input type='checkbox' name='a' value='700'> 5 </p>
<p><input type='checkbox' name='a' value='701'> 6 </p>
<p><input type='checkbox' name='a' value='702'> 7 </p>
<p><input type='checkbox' name='a' value='703'> 8 </p>
<p><input type='checkbox' name='a' value='704'> 9 </p>
<p><input type='checkbox' name='a' value='705'> 10 </p>
<p><input type='checkbox' name='a' value='706'> 11 </p>
<p><input type='checkbox' name='a' value='707'> 12</p>
</div>
<input name="f_select_category" type="text" maxlength="255" size="50" value="699,702,703,">
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
var b = document.querySelector("input[name='f_select_category']").value.match(/\d+/g) || [];
[].forEach.call(document.querySelectorAll(".checkklass input"), function(a) {
a.checked = ~b.indexOf(a.value)
})
});
</script>
</body>
</html>
|
|
05.03.2016, 01:49
|
Аспирант
|
|
Регистрация: 20.02.2015
Сообщений: 54
|
|
Не сработало.
<!DOCTYPE HTML>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class='checkklass'>
<p><input type='checkbox' name='a' value='699'> 4 </p>
<p><input type='checkbox' name='a' value='700'> 5 </p>
<p><input type='checkbox' name='a' value='701'> 6 </p>
<p><input type='checkbox' name='a' value='702'> 7 </p>
<p><input type='checkbox' name='a' value='703'> 8 </p>
<p><input type='checkbox' name='a' value='704'> 9 </p>
<p><input type='checkbox' name='a' value='705'> 10 </p>
<p><input type='checkbox' name='a' value='706'> 11 </p>
<p><input type='checkbox' name='a' value='707'> 12</p>
</div>
<input name="f_select_category" type="text" maxlength="255" size="50" value=",700,701,702," onchange="jQuery.modal.nc_modal_confirm=true;undefined">
<script type="text/javascript">
var check=$("input[name='a']");
check.change(function(){
var names=',';
check.each(function(){if($(this).is(':checked')){names+=$(this).val()+',';}});
$("input[name='f_select_category']").val(names);
});
$("input[name='f_select_category']").val();
window.addEventListener("DOMContentLoaded", function() {
document.querySelector("input[name='f_select_category']").addEventListener("input", function() {
var b = this.value.match(/\d+/g) || [];
[].forEach.call(document.querySelectorAll(".checkklass input"), function(a) {
a.checked = ~b.indexOf(a.value)
})
})
});
</script>
</body>
</html>
|
|
05.03.2016, 02:06
|
Аспирант
|
|
Регистрация: 20.02.2015
Сообщений: 54
|
|
рони, да, этот рабочий вариант, спасибо большое. Хочу еще узнать, есть ли способ заставить выполняться этот скрипт после полной загрузки страницы?
Последний раз редактировалось k_DizeL, 05.03.2016 в 02:20.
Причина: глупость сморозил
|
|
05.03.2016, 02:30
|
Аспирант
|
|
Регистрация: 20.02.2015
Сообщений: 54
|
|
Возникла еще одна проблема. Скрипт должен выполнится в ajax окне, которое подгружается без перезагрузки страницы. Соотвественно обработчик DOMContentLoaded несрабатывает. На что его можно заменить? Не бред, если заменить на выполнение скрипта по движению мышки? Обработчиком mousemove
Последний раз редактировалось k_DizeL, 05.03.2016 в 02:33.
|
|
|
|