Using jQuery, how do you mimic the form serialization for a select with multiple options selected in a $.ajax call?

这一生的挚爱 提交于 2019-12-05 00:16:37

问题


Below is my $.ajax call, how do I put a selects (multiple) selected values in the data section?

$.ajax({
    type: "post",
    url: "http://myServer" ,
    dataType: "text",
    data: {
        'service' : 'myService',
        'program' : 'myProgram',
        'start' : start,
        'end' : end ,
        },
    success: function(request) {
      result.innerHTML = request ;
    }   // End success
  }); // End ajax method

EDIT I should have included that I understand how to loop through the selects selected options with this code:

$('#userid option').each(function(i) {
 if (this.selected == true) {

but how do I fit that into my data: section?


回答1:


how about using an array?

data: {
    ...
    'select' : ['value1', 'value2', 'value3'],
    ...
},

edit: ah sorry, here's the code, a few caveats:

'select' : $('#myselectbox').serializeArray(),

in order for serializeArray() to work though, all form elements must have a name attribute. the value of 'select' above will be an array of objects containing the name and values of the selected elements.

'select' : [
    { 'name' : 'box', 'value' : 1 },
    { 'name' : 'box', 'value' : 2 }
],

the select box to produce the above result would be:

<select multiple="true" name="box" id="myselectbox">
   <option value="1" name="option1" selected="selected">One</option>
   <option value="2" name="option2" selected="selected">Two</option>
   <option value="3" name="option3">Three</option>
</select>



回答2:


Thanks to the answer from @Owen, I got this code to work.

For a select box with an id="mySelect" multiple="true"

    var mySelections = [];
    $('#mySelect option').each(function(i) {
        if (this.selected == true) {
            mySelections.push(this.value);
        }
    });


    $.ajax({
      type: "post",
      url: "http://myServer" ,
      dataType: "text",
      data: {
        'service' : 'myService',
        'program' : 'myProgram',
        'selected' : mySelections
        },
      success: function(request) {
        result.innerHTML = request ;
      }
    }); // End ajax method



回答3:


The correct way to represent a collection of multiple options selected is to use an array, by naming the SELECT tag with a [] suffix.
The problem is that it is not correctly handled by the jQuery method serialize().
For a SELECT like this, infact:

<select name="a[]">
    <option value="five">5</option>
    <option value="six">6</option>
    <option value="seven">7</option>
</select>

serialize sends this array: a[]=0&a[]=1&a[]=2 received by PHP this way:

[a] => Array
    (
        [0] => 0
        [1] => 1
        [2] => 2
    )

where real values are lost.



来源:https://stackoverflow.com/questions/195058/using-jquery-how-do-you-mimic-the-form-serialization-for-a-select-with-multiple

标签

工具导航Map