The first is the Ajax filling plug-in filloptions. This plug-in can obtain data through Ajax and add the data to the drop-down list box. The data format supports XML and JSON formats. The plug-in definition is as follows:
Filloptions (URL, options)
Parameter description
URL: the URL of the Ajax request, required
Options includes the following parameters:
Datatype: the format of the data returned by the Ajax request, which can be XML or JSON. The default value is JSON"
Textfield: The text field of the drop-down list box option in the data returned by the Ajax request. The default value is "text"
Valuefiled: The option value field in the drop-down list box returned by the Ajax request. The default value is "value"
Keepold: boolean type, whether to retain the original option of the drop-down list box option, which is not retained by default.
Selected: numeric type. The number of items after the fill option is selected. The default value is 0.
Example:
$ ("# Select1"). filloptions ("handler1.ashx? Type = JSON ", {datatype:" JSON ", textfield:" Province ", valuefiled:" provinceid "});
Instance description:
Select1 is a drop-down list box on the page. Access "handler1.ashx? Type = JSON ", return" [{"provinceid": "110000", "Province": "Beijing" },{ "provinceid": "120000 ", "Province": "Tianjin"}] ", and then generate the option of the drop-down list box and add it to select1 through the specified textfield and valuefiled parameters. For more examples, see the following test.htm drop-down list box Association plug-in cascadingselect. This plug-in is created based on the above filloptions plug-in and can implement association between two drop-down lists. The definitions are as follows: cascadingselect) parameter description: target: the drop-down list box to be linked. The URL must be the address of the Ajax request. options must be similar to filloptions. A parameter is added: the Parameter Name of the value returned when an Ajax request is sent, which must be endfn: the type is function. After the association is completed, the execution instance is as follows: $ ("# select1 "). cascadingselect (
$ ("# Select2 "),
"Handler1.ashx? Type = JSON ",
{Datatype: "JSON", textfield: "city", valuefiled: "cityid", parameter: "p "},
Function (){
$ ("# Select2"). addoption ("select", "-1", true, 0 );
$ ("# Select3" ).html ("");
$ ("# Select3"). addoption ("no option", "-1", true, 0 );
}
);
Instance Description: select1, select2, and select3 are all drop-down lists on the page. By setting the parameter: "P", a "handler1.ashx? P = xxx & type = JSON "is used as an Ajax request. XXX is the value selected by select1, and filloptions is used to fill the option of select2. For more information, see the three-level linkage between provinces, cities, and cities in test1.htm. Addoption, a plug-in for adding a list item, is relatively simple. It is used to add a list item to the drop-down list box. Definition: addoption (text, value, selected, index) parameter description: Text: text type, list item text value: text type, list item value selected: boolean type, whether to select the index: numeric type of the list item to be added. The add location instance is as follows: $ ("# select2 "). addoption ("select", "-1", true, 0 );
Instance Description: Insert a list item whose text is "select" and value is "-1" to the top of select2.