How to get the label name as value for the selected/checked checkboxes in Django template
Question
In django template , i have a modal which pops up on click of a span.
<div class="modal-body">
<form action="#">
<fieldset>
<legend>Please Select Your Option</legend>
<p><label style="font-size:15px;"><input type="checkbox" style="margin-right:5px;" id="selectAll"/>Select All</label></p>
<div id="options">
{% for data in allData %}
<p><label style="font-size:15px;" for={{data}}><input type="checkbox" style="margin-right:5px;" value={{data}}/>{{option}}</label></p>
{% endfor %}
<div>
</fieldset>
</form>
</div>
I saw many examples and get to know that using ids i can access the value property of each checkbox. but i am really confused in this case where the no of checkboxes are dynamic.
I want to access the label name as the value . Any help?
Edit :
var allVals = [];
$('#options :checked').each(function() {
allVals.push($(this).val());
});
console.log(allVals);
I used this jquery code to get the values, but it doesnot returns the complete value, as i have done in the code (put the label name in value property).
Eg. If the option says:
a,b,c,d
it returns the array having [a].
1 answers
solution1
0 ACCPTED 2016-01-20 08:46:21
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(document).ready(function(){
// for delete row
$('#container').on('click', 'input[type="checkbox"]', function () {
alert($(this).closest('label').text());
});
$('#btnAdd').click(function () {
iCounter=$('#container p').siblings().length + 1
$('#container').append('<p><label style="font-size:15px;" for="test1"><input type="checkbox" style="margin-right:5px;" value="test1"/>sample' + iCounter + '</label></p>');
});
});
</script>
</head>
<body>
<button id="btnAdd">Add Data</button>
<div class="modal-body">
<form action="#">
<fieldset>
<legend>Please Select Your Option</legend>
<p><label style="font-size:15px;"><input type="checkbox" style="margin-right:5px;" id="selectAll"/>Select All</label></p>
<div id="container">
<p><label style="font-size:15px;" for="test1"><input type="checkbox" style="margin-right:5px;" value="test1"/>sample</label></p>
</div>
</fieldset>
</form>
</div>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.