Jquery serialize and multi select dropdown

Asked
Active3 hr before
Viewed126 times

8 Answers

multijqueryselect
90%

Stack Overflow Public questions & answers , Stack Overflow for Teams Where developers & technologists share private knowledge with coworkers , GitLab launches Collective on Stack Overflow ,the serialize doesn't work correctly anymore. so if I select 3 users I get a query string like

Your elements name must be array type factoryUsers[] Change your code this:

<select size="5" id="factoryUsers" name="factoryUsers[]" multiple="multiple">
load more v
88%

serialize() question ,[jQuery] Serialize() , Sortable serialize? ,© 2013 jQuery Foundation


<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Test</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#order').submit(function() { alert( $(this).serialize() ); return false; }); }); </script> </head> <body> <form id="order" method="post" action="./"> <input name="input1" type="text" value="Hello World" /> <input name="input2" type="text" value="World" /> <select name="product" size="3" multiple="multiple"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3" selected="selected">3</option> </select> <input type="submit" value="submit" /> </form> </body> </html>
72%

I have been using the jquery serialize() function to serialize the values of a form and submit it via ajax,If this item is one of your form. Then try to add the value of item end of the serialize. Example: ,the serialize doesn't work correctly anymore. so if I select 3 users I get a query string like ,Since, the item written twice into the request, the last value will be valid in controller.

Your elements name must be array type factoryUsers[] Change your code this:

<select size="5" id="factoryUsers" name="factoryUsers[]" multiple="multiple">
load more v
65%

The returned object contains only a single value for a <select multiple> with multiple values selected. The expected value would be an array with all selected values.,Using 3.x you will be able to do <select name="foo" multiple> and get an array of results.,For those who are experiencing the same issue you can use the following solution:,By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

<select name="multi_test" multiple>
load more v
75%

I have been using the jquery serialize() function to serialize the values of a form and submit it via ajax,like for e.g. if the form name and id is factoryUsers,the serialize doesn't work correctly anymore. so if I select 3 users I get a query string like ,Beware that forms can have fields with repeated names, and what you're trying to do doesn't support that. Also, the order of fields in HTML forms can be significant. (These are both reasons that serializeArray works the way it does.)

That can be achieved real easily by listening events. You could make the color red for example by adding class and removing class to autocomplete. I think you can accomplish this yourself with a little bit of effort.

select: function( event, ui ) {
    var terms = split( this.value );
    if(terms.length <= 2) { 
        // remove the current input
        terms.pop();
        // add the selected item
        terms.push( ui.item.value );
        // add placeholder to get the comma-and-space at the end
        terms.push( "" );
        this.value = terms.join( ", " );
        return false;
    } else {
        var last = terms.pop();
        $(this).val(this.value.substr(0, this.value.length - last.length - 2)); // removes text from input
        $(this).effect("highlight", {}, 1000);
        $(this).addClass("red");
        $("#warnings").html("<span style='color:red;'>Max people reached</span>");
        return false;
    }
}
load more v
40%

Select2 also supports multi-value select boxes. The select below is declared with the multiple attribute.,Select2 was designed to be a replacement for the standard <select> box that is displayed by the browser. By default it supports all options and operations that are available in a standard select box, but with added flexibility.,Select2 can take a regular select box like this..., Add, select, or clear items

<select class="js-example-basic-single" name="state">
   <option value="AL">Alabama</option>
   ...
   <option value="WY">Wyoming</option>
</select>
load more v
22%

The .serializeArray() method can act on a jQuery object that has selected individual form elements, such as <input>, <textarea>, and <select>. However, it is typically easier to select the <form> tag itself for serialization:,The .serializeArray() method creates a JavaScript array of objects, ready to be encoded as a JSON string. It operates on a jQuery object representing a set of form elements. The form elements can be of several types:, version added: 1.2.serializeArray(),Description: Encode a set of form elements as an array of names and values.

The .serializeArray() method creates a JavaScript array of objects, ready to be encoded as a JSON string. It operates on a jQuery object representing a set of form elements. The form elements can be of several types:

<form>
   <div><input type="text" name="a" value="1" id="a" /></div>
   <div><input type="text" name="b" value="2" id="b" /></div>
   <div><input type="hidden" name="c" value="3" id="c" /></div>
   <div>
      <textarea name="d" rows="8" cols="40">4</textarea>
   </div>
   <div><select name="e">
         <option value="5" selected="selected">5</option>
         <option value="6">6</option>
         <option value="7">7</option>
      </select></div>
   <div>
      <input type="checkbox" name="f" value="8" id="f" />
   </div>
   <div>
      <input type="submit" name="g" value="Submit" id="g" />
   </div>
</form>

The .serializeArray() method can act on a jQuery object that has selected individual form elements, such as <input>, <textarea>, and <select>. However, it is typically easier to select the <form> tag itself for serialization:

$('form').submit(function() {
   $.print($(this).serializeArray());
   return false;
});

This produces the following data structure:

[{
      name: a
      value: 1
   },
   {
      name: b
      value: 2
   },
   {
      name: c
      value: 3
   },
   {
      name: d
      value: 4
   },
   {
      name: e
      value: 5
   }
]
load more v
60%

how to bind dropdownlist with checkbox for multiple selection inside jQuery DataTable in ASP.Net Core MVC,Check this example. Now please take its reference and correct your code., Questions,Download Northwind Database

Model

public class Customer {
   public string CustomerID {
      get;
      set;
   }
   public string ContactName {
      get;
      set;
   }
   public string City {
      get;
      set;
   }
   public string Country {
      get;
      set;
   }
}
load more v

Other "multi-jquery" queries related to "Jquery serialize and multi select dropdown"