I am developing a laravel application with blade template.
When I click on the plus button, I get an additional field and when I click the minus button it gets removed properly and working fine.
However, I need to generate the additional section as a select option box, and this select option box has to show dynamic values.
<div class="RegSpLeft" id="affiliation">
<select>
@foreach($affiliation_array as $state_data)
<option>{{$state_data->value}}</option>
@endforeach
</select>
</div>
I want to display above array named affiliation_array
.
I'm using the following script to generate additional fields:
$('.affiliation_add a.pl').click(function(e) {
e.preventDefault();
$('#affiliation').append('<select><!--here i want to append my array as options --></select>');
num2++
});
$('.affiliation_add a.mi').click(function (e) {
e.preventDefault();
if ($('#affiliation select').length > 1) {
$('#affiliation').children().last().remove();
}
});
My button div is below,
<div class="RegSpRight affiliation_add">
<a href="#" class="pl"><img src="images/plus.png"></a>
<a href="#" class="mi"><img src="images/minus.png"></a>
</div>
Anybody please help me to solve this issue.
This should work:
$('.affiliation_add a.pl').click(function(e) {
e.preventDefault();
$('#affiliation').append('<select>@foreach( $affiliation_array as $state_js )<option> {{ $state_js->value }}</option> @endforeach</select>');
num2++
});
$('.affiliation_add a.mi').click(function (e) {
e.preventDefault();
if ($('#affiliation select').length > 1) {
$('#affiliation').children().last().remove();
}
});
You can copy and paste that into you project. You should just remember to change the variable name $state_js to any other name you like, or you could still leave it as that if you dont mind.You can also decide to add the option name and value to the option i put there. For example:
<option value={{ $state->value }}> {{ $state_js->value }}</option>