Boostrap Dual List Box

Question

Boostrap Dual List Box

Navigation

#1 by (2 votes)

0

Good morning, I would need to know please how to pass the result of the chosen options in a double bootstrap list to a php variable to do POST to another page.

 <div class="panel">
<form id="demoform" class="hide-list-label" action="#" method="post">
    <div class="panel-heading">
        <span class="panel-title"> Dual Select Listbox </span>
    </div>
    <div class="panel-body p25">
        <select class="demo1" multiple="multiple" size="10" name="demo1">
            <option value="option1">Option 1</option>
            <option value="option2">Option 2</option>
            <option value="option3">Option 3</option>
            <option value="option4">Option 4</option>
            <option value="option5">Option 5</option>
            <option value="option6">Option 6</option>
            <option value="option7">Option 7</option>
            <option value="option8">Option 8</option>
            <option value="option9">Option 9</option>
            <option value="option10">Option 10</option>
            <option value="option11">Option 11</option>
            <option value="option12">Option 12</option>
            <option value="option13">Option 13</option>
            <option value="option14">Option 14</option>
            <option value="option15">Option 15</option>
        </select>
    </div>
    <div class="panel-footer text-right">
        <button type="submit" class="btn btn-default ph25">Submit Data</button>
    </div>
</form>

<script>
var demo1 = $('.demo1').bootstrapDualListbox({
    nonSelectedListLabel: 'Options',
    selectedListLabel: 'Selected',
    preserveSelectionOnMove: 'moved',
    moveOnSelect: true,
    nonSelectedFilter: 'tion ([1-3]|[1][0-5])'
});

$("#demoform").submit(function() {
    alert("Options Selected: " + $('.demo1').val());
    return false;
});
</script>

javascript php

asked by Vieira 23.01.2017 в 12:54

source

1 answer

Clear Data Jquery When Opening Another Modal Problems with "Pluviometer" Hashmap, List ... java.lang.StackOverflowError

score 2 · Accepted Answer

the plugin bootstrap-duallistbox creates a new select with the same name as the original select + _helper{1,2} . In your case: demo1_helper2 will have the list of selected values (read the documentation and the configuration of helperSelectNamePostfix )

Once you make the POST to your script PHP , it will receive these values in $_POST['demo1_helper2'] .

Finally, it is important to note that your script JS , is preventing POST to your script, because it returns false in any case. To solve this, it would suffice to take the return false of submit .

greetings