Передавать массив через checkbox
Есть форма, где много полей
<input type="checkbox" name="checkbox" value="" item_cat="list"> <input type="checkbox" name="checkbox" value="" item_cat="food"> <input type="checkbox" name="checkbox" value="" item_cat="cars"> Хочу при клике на поле сохранять/удалять его значение item_cat в скрытое поле, что бы потом передать бекенд.
$(document).on("click", "[name=checkbox]", function(){
var c_pref = $(this).attr('item_pref');
});
В скрытое поле хочу соберать их виде food,cars,list, последовательность не имеет отношения... Спасибо. |
Pantela,
http://api.jquery.com/serialize/
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$(document).on("click", "[name=checkbox]", function(){
var c_pref = [];
$("[name=checkbox]:checked").attr('item_cat', function(i, item) {
c_pref.push(item)
});
c_pref += "";
alert(c_pref);
});
});
</script>
</head>
<body>
<input type="checkbox" name="checkbox" value="" item_cat="list">
<input type="checkbox" name="checkbox" value="" item_cat="food">
<input type="checkbox" name="checkbox" value="" item_cat="cars">
</body>
</html>
|
<input type="checkbox" name="checkbox" value="" item_cat="list">
<input type="checkbox" name="checkbox" value="" item_cat="food">
<input type="checkbox" name="checkbox" value="" item_cat="cars">
<input type="//hidden" name="checkbox-list" value="">
<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).on('click', 'input[name="checkbox"]', function(){
$('input[name="checkbox-list"]').val(
$('input[name="checkbox"]:checked')
.map(function(){
return this.getAttribute('item_cat')
})
.toArray()
.join(',')
)
});
</script>
|
Aetae,
Цитата:
<input type="checkbox" name="checkbox" value="" item_cat="list">
<input type="checkbox" name="checkbox" value="" item_cat="food">
<input type="checkbox" name="checkbox" value="" item_cat="cars">
<input type="//hidden" name="checkbox-list" value="">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).on('click', 'input[name="checkbox"]', function(){
$('input[name="checkbox-list"]').val(
$.map($('input[name="checkbox"]:checked'),function(el){
return el.getAttribute('item_cat')
})
)
});
</script>
|
или так
<input type="checkbox" name="checkbox" value="" item_cat="list">
<input type="checkbox" name="checkbox" value="" item_cat="food">
<input type="checkbox" name="checkbox" value="" item_cat="cars">
<input type="//hidden" name="checkbox-list" value="">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).on('click', 'input[name="checkbox"]', function(){
$('input[name="checkbox-list"]').val(
$('input[name="checkbox"]:checked')
.map(function(){
return this.getAttribute('item_cat')
})
.get()
)
});
</script>
|
Выбросить скрытое поле, то что в item_cat должно быть именем полей, и тогда бразуер без всяких скриптов отправит на сервер выбранное.
|
Всем большое спасибо.
Без скрытого поля помоему никак, т.к. я поля выделяю записи, беру ихрнее value, и потом передаю все пачой на бекенд. Передавать все по шагам при веденении не вариант. |
Цитата:
|
рони, это всё неявно, у меня же по пунктам понятно что происходит.)
Цитата:
|
Цитата:
Наличие <input type="//hidden" name="checkbox-list" value=""> и оперирование его значением на сервере говорит о том, что на сервере полный бардак, а о "безопасности" даже и не думают. |
| Часовой пояс GMT +3, время: 08:33. |