I'm using Bootstrap Dual Listbox to select multiple data and to show the user how many persons will be in a oficial list and who won't. You can see an example on this page: http://www.virtuosoft.eu/code/bootstrap-duallistbox/
The point is that, even though it works, I would like to know How do I know which box has the selected items and send them through POST using PHP, because the only "select" tag that you can see in HTML is the only one with all the options that you want to select, and when you are moving the data side to side it creates to containers dynamically call box1 and box2.
The code it is almost the same of this link, 'cause I couldn't write down the code here,don't know why it didn't display all the code (new one): Bootstrap Dual Listbox : How to Limit Selected Option, but is not the question that I was looking for.
Hope you understand my point!!
Thank you very much!
My view:
{!! Form::open(['class'=>'form-horizontal','role'=>'form']) !!}
<select multiple="multiple" size="10" name="facturas[]" id="selectfacturas">
@foreach($facturas as $factura)
<option value="{{ $factura->id }}"{{ ( $factura->ordendepago_id==$op->id ? ' selected="selected"':'') }}>{{ $factura->descripcionLinda() }}</option>
@endforeach
</select>
<script>
var demo2 = $('#selectfacturas').bootstrapDualListbox({
nonSelectedListLabel: 'Comprobantes disponibles',
selectedListLabel: 'Comprobantes imputados a esta orden',
preserveSelectionOnMove: 'moved',
moveOnSelect: false,
showFilterInputs: false,
});
</script>
{!!Form::submit( 'Siguiente',array('class'=>'btn btn-primary','id'=>'btn-submit'))!!}
{!!Form::close()!!}
Then, in my controller:
public function selefacturasPost( $id ) {
dd( \Input::All() );
It returns an Array!
array:2 [▼
"_token" => "YTlypLsDjO37GGTAHXcKcKfho1vKYx5c0xgDN1cM"
"facturas" => array:2 [▶]
]
Here is my solution:
<-- HTML: -->
<form action="your_php_file.php" method="post" id="your-dual-listbox-form">
<select multiple="multiple" size="10" name="duallistbox" id="initializeDuallistbox">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3" selected="selected">Option 3</option>
...
<option value="option20" selected="selected">Option 20</option>
</select>
<input type="hidden" name="DataFromRightSideList" value="null" id="setState">
<button type="submit" class="btn btn-primary">Save</button>
</form>
<-- jQuery: -->
<script type="text/javascript">
$('#your-dual-listbox-form').submit(function() {
var formData = $('[name="duallistbox"]').val(); //this will get as a string values from the right side Your dual listbox
$(function () {
$('#setState').val(formData); //this will change value of input id="setState"
});
$( '#your-dual-listbox-form' ).submit(); //and here submit your form
return false;
});
</script>
<-- PHP: -->
<?php
echo $_POST['DataFromRightSideList']; //it will print something like "option 3, ..., option20"
?>
</div>