Select2不会创建名称属性

With the select2 jQuery PlugIn I created a tag box. Therefore I used the following html form code:

<form action="someAction" method="post">
    <fieldset>
        <select id="tags" multiple="" name="tags">
            <option value="tag1">val1</option>
            <option value="tag2">val2</option>
            <option value="tag3">val3</option>
        </select>
        <button type="submit" class="btn">Submit</button>
    </fieldset>
</form>

Select2 generates the following field from it:

<input type="text" class="select2-input" autocomplete="off" id="s2id_autogen1" style="width: 10px;">

The problem is here that the name attribute is missing. How can I get the data/text of the input field out of the $_POSTvariable in PHP if there is no name attribute? How can I manage this?

The setup JS is the following:

$(document).ready(function() {
$("#tags").select2({
    placeholder: "Insert tag",
    allowClear: true,
    minimumInputLength: 2,
    maximumSelectionSize: 1,
    minimumWidth: 200
});

});

POST needs name to work, however I notice it has an id:

id="s2id_autogen1"

Use JS to grab the value by id and post it.

If the id is ever changing you can use the class:

HTML:

<form action="someAction" method="post">
<fieldset>
    <!-- This will contain the value from the generated input -->
    <input type = 'hidden' name = 'myField' id = 'myField' />
    <select id="tags" multiple="" name="tags">
        <option value="tag1">val1</option>
        <option value="tag2">val2</option>
        <option value="tag3">val3</option>
    </select>
    <button type="submit" class="btn">Submit</button>
</fieldset>

JS

$(document).ready(function(){
       $("#tags").select2({
       placeholder: "Insert tag",
       allowClear: true,
       minimumInputLength: 2,
       maximumSelectionSize: 1,
       minimumWidth: 200
});

//Make it so everytime the input with the class select2-input value is changed
//the value gets copied into the element with the id myField
$('input.select2-input').live('change', function(){
    $('input#myField').val($(this).val());
});

});

Like this submitting the form will automatically include the value int the POST variable.

I had a quick read through some of the tickets in the select2 Github account and a couple of them mention this problem. It appears that select2 just doesn't add the name attribute.

You could try dynamically adding one via JS on form submit, and see if that works,

$('form').submit(function() {
    $('#s2id_autogen1').attr('name', 'whatever');
    return true;
});

Or you could submit your form via ajax and grab the value via the ID and post it that way

After much reading, I decided to change the select2.js itself.

At line 2109 change it to

this.focusser.attr("id", "s2id_"+this.select.context.id);

If your input tag is as so

<select id="fichier">

Hence your input tag that is searching through the list will have an id of s2id_fichier_search

As far as I know, there shouldn't be a conflict and THIS will allow you to have multiple select2 on the same page and run your functions through their events eg.

$(function() { 
  $('#s2id_fichier_search').keyup(function() {
    console.log('Be Practical')
  })
}

So this will run like if you were to use

<select id="fichier" onkeyup="console.log('Be Practical')">

Definetly I solved that with this simple snippet.

I added a hidden input:

<input type="hidden" id="manufacturer" name="manufacturer" value="1">

And an ID in the select:

<select class="full-width required" data-placeholder="Select Country" data-init-plugin="select2" required id='myselect'>

Then just add that simple JS in the same page to change the hidden value every time the user change the value:

    <script type='text/javascript'>
    $(function() {
        $('#myselect').change(function() {
            // if changed to, for example, the last option, then
            // $(this).find('option:selected').text() == D
            // $(this).val() == 4
            // get whatever value you want into a variable
            var x = $(this).val();
            // and update the hidden input's value
            $('#manufacturer').val(x);
            alert("cambiado");
        });
    });
    </script>

</div>

it's an old question, but correct answer for current select2 4.x.x version is to set name attribute as array

<select id="tags" multiple="" name="tags[]">

and then you can get array with $_POST like that:

$_POST['tags']