This is my view file code
<?php for($i=0; $i<4; $i++) { ?>
<div class="box22">
<div class="mcm">
<input type="text" placeholder="Myself" id="coworkers" name="coworkers[]" />
<span class="bar"></span>
</div>
<div class="select2">
<select id="category_<?php echo $i; ?>" name="category[]" class="chosen-select ref-sel1" multiple >
<?php
foreach($genre as $gen){
echo '<option value='.$gen->genre_id.'>'.$gen->genre_name.'</option>';
}
?>
</select>
</div>
</div>
<?php } ?>
my script : when i chose one or more from option, it does not comes into script. How to get multiple values under loop
$(document).ready(function()
{
$('form#shortfilm').submit(function(e)
{
e.preventDefault();
var form = $(this);
var foo = [];
$('#category :selected').each(function(i, selected){
foo[i] = $(selected).text();
});
});
});
With jQuery, you can use the . val() method to get an array of the selected values on a multi-select dropdown list.
Get Multiple Selected Values of Select Dropdown in PHPAdd the multiple tag with select tag also define array with name property. Make sure the Fruits array is not empty, run a foreach loop to iterate over every value of the select dropdown. Display the selected values else show the error message to the user.
Given a list of items and the task is to retrieve the multiple selected value from a select box using PHP. Use multiple attribute in HTML to select multiple value from drop down list.
To get the selected values of a multiple select element on change with JavaScript, we can get all the options from the selectedOptions property of the select element. ← How to add an array to two-dimensional array with JavaScript? → How to get all keys of a deep object in JavaScript?
We can select the multiple options in the dropdown list using the multipleattribute. There are several ways in JavaScript to return the selected values in a multi-select dropdown. 1. Using for…ofstatement
If anyone wants to get only the selected value on click to an option, he can do the follow: Show activity on this post. As of 2016, you can do this more simply than in any of the answers already given: where "myChosenBox" is the id of the original select input. Or, in the change event:
I believe the problem occurs when targeting by ID, because Chosen will copy the ID from the original select onto it's newly created div, leaving you with 2 elements of the same (now not-unique) ID on the current page. When targeting Chosen by ID, use a selector specific to the select: ...instead of...
change text to val()
$('option:selected').each(function(i, selected){
foo.push($(selected).val());
});
or:
var foo = [];
$('.box22').each(function(x,v){
var temp =[]
$(v).find('option:selected').each(function(i, selected){
temp.push($(selected).val());
});
foo.push(temp)
});
see demo for the second option here
Please run this sample code. This may help you
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
</head>
<body>
<form id="shortfilm" name="data">
<?php $genre=array(1=>'AAAAAAAAAAAAAA',2=>'BBBBBBBBBBBBBBB',3=>'CCCCCCCCC',4=>'DDDDDDDDDDDDDD',5=>'EEEEEEEEEEEEEEE');
for($i=0; $i<4; $i++) { ?>
<div class="box22">
<div class="mcm">
<input type="text" placeholder="Myself" id="coworkers" name="coworkers<?php echo$i?>[]" />
<span class="bar"></span>
</div>
<div class="select2">
<select class="category" name="category<?php echo$i?>[]" class="chosen-select ref-sel1" multiple >
<?php
foreach($genre as $key => $gen){
echo '<option value='.$key.'>'.$gen.'</option>';
}
?>
</select>
</div>
</div>
<?php } ?>
<input type="submit" value="submit" />
</form>
<script>
$(document).ready(function()
{
$('form#shortfilm').submit(function(e)
{
e.preventDefault();
var form = $(this);
var foo = [];
$('.category :selected').each(function(i, selected){
foo[i] = $(selected).text();
});
console.log(foo);
});
});
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With