Getting selected data in Form from Select2 ajax call

Question

I am using Select2 jQuery plugin in a HTML form to get remote data via ajax call. This functionality works fine.

But when the form is submitted, the selected value in the Select2 element is not available in the form POST data.

I am able to get the data about Radio button and the submit button, but not the userbox element bound with Select2.

What should be done to get the selected data in the form for processing in PHP?

<form name='adminForm' method="post">
       <input type="radio" name="type" value="all"> 1 <br/>
       <input type="radio" name="type" value="from"> 2 <br/>
       <input type="radio" name="type" value="to"> 3 <br/>

       <div id="userbox"></div>

       <input type="submit" value="Submit" name="searchMessages">

</form>

Below is the jQuery code that I use.

$("#userbox").select2({
    minimumInputLength: 1,
    formatResult: productFormatResult, // Not provided here
    formatSelection: productFormatSelection, // Not provided here
    ajax: { 
        url: "/url/path",
        data: function (term, page) {
            return {
                q: term,
            };
        },
        results: function (data, page) {
            return {results: data};
        }
    },
    escapeMarkup: function (m) { return m; }
});

Answer 1

The point is,

whenever a form gets submitted, it sends all the input tags and only those which has name

attribute. It's like a key-value map with the input names as keys and their values as values .

I found when i select any item , there are no input control to save the selected value ,

so you could prepare a hidden field to save the selected value and you will

get the value from backend code

Answer 2

just replace <div id="userbox"></div> by <input id="userbox" name="user box"/>