A simple example of two-level linkage in the AJAX implementation of Spring MVC _jquery

Write a project today encountered two-level linkage, the period encountered some problems, write a blog record.

Backstage Controller:

@RequestMapping ("/faulttype")
@ResponseBody public
map<string,object> faulttype (int id, HttpServletRequest request) throws IOException
{
String returnmessage = "";
Gets all subclass fault type
list<faulttype> Faulist=faulttypeservice.getbyid (ID);
if (Faulist.size () >0) {
request.setattribute ("Childtype", faulist);
ReturnMessage = "OK";
} else {
ReturnMessage = "no information found";
}
map<string,object> returnmap = new Hashmap<string,object> ();
Returnmap.put ("Childtype", faulist);
return returnmap;
}

Foreground JSP:

<div class= "col-sm-3" > <div class= "Form-group" > <label class= "col-3" Control-label no-padding-right " > Failure Type: </label> <select name= "Faulttype" id= "Faulttype" onchange= "Javascript:typechange ()" > <c: ForEach items= "${faultlist}" var= "Faulist" > <option value= "${faulist.faultid}" >${faulist.faultcontent} </option> </c:forEach> </select> </div> </div> <div class= "col-sm-3" > <div class= "Form-group" > <label class= "col-3 control-label no-padding-right" > Failure: </label> <input id= " Childtypecont "Name=" Childtypecont "value=" type= "hidden" class= "col-sm-4 Form-control" placeholder= "Failure" > < Select Name= "Faulttype1" id= "Faulttype1" "> <option>--Please select--</option> <c:foreach items=" ${childtype } "var=" Faulist > <option value= "${faulist.faultid}" >${faulist.faultcontent}</option>: foreach> </select> </select> </div> </div>

Js:

function Typechange () {
var type=$ ("#faulttype"). Val ();

var html = "<option>--Please select--</option>"; 
var commiturl = "faulttype.do?id=" + type;

$.ajax ({
type: POST),
contentType: "Application/json",
Url:commiturl,
dataType: ' JSON ',
Success:function (Result) {
var curedata = $.extend (true, [], result); 
if (Curedata.childtype!= null) {for 
(var i=0;i<curedata.childtype.length;i++) {

html+= "<option value = ' "+curedata.childtype[i].faultid+" ' > "+curedata.childtype[i].faultcontent+" </option> ";
}
$ ("#faulttype1"). empty ();
$ (HTML). Appendto ("#faulttype1");

}
});
}

The following is a reference to someone else's writing (original address: http://blog.csdn.net/gis__/article/details/6647464)

A bad memory can be collected:

1, dropdown box:

var cc1  = $ (". formcselect[@name = ' country '] option[@selected]"). Text ()//(note that there are spaces in the middle) 

var cc2 = $ (' . formcselect[@name = "Country"]. Val (); The value of the selected item of the Drop-down menu is obtained 

var cc3 = $ ('. FORMC select[@name = ' country '] '). attr ("id"), or the id attribute value (" 

#select") of the selected item of the Drop-down menu. Empty ()//Clear dropdown box//$ ("#select"). HTML ("); 

$ ("<optionvalueoptionvalue= ' 1 ' >1111</option>"). Appendto ("#select")//option to add a drop-down box 

A little explanation:

1.select[@name = ' country '] option[@selected] Represents the Name property,

and the attribute value is the option element with the selected attribute inside the Select element of ' country ';

It can be seen that a @ begins with a property that follows.

2, Radio Box:

$ ("input[@type =radio][@checked]"). Val (); Gets the value of the selected item in the Radio box (note that there are no spaces in the middle) 

$ ("input[@type =radio][@value =2]"). attr ("Checked", ' checked ');//Set the Radio box value=2 is selected. ( Note that there are no spaces in the middle) 

3, check box:

$ ("input[@type =checkbox][@checked]"). Val (); Gets the value of the first item selected in the check box 

$ ("input[@type =checkbox][@checked]"). each (function () {//The check box is typically selected for more than one, so you can loop out 

 alert ($ (this). Val ()); 

$ ("#chk1"). attr ("Checked", "")//Do not tick 

$ ("#chk2"). attr ("Checked", true);/tick 

if ($ ("#chk1"). attr (' checked ') ==undefined) {}//judge whether the tick has been ticked 

Of course jquery's selector is powerful. There are many other ways.

<script src= "Jquery-1.2.1.js" type= "Text/javascript" ></script> 

<script "JavaScript" Type= "Text/javascript" > 

$ (document). Ready (function () { 

$ (#selectTest). Change (function () 

{ 

   Alert ("Hello"); 

   Alert ($ ("#selectTest"). attr ("name")); 

  $ ("a"). attr ("href", "xx.html"); 

   Window.location.href= "xx.html"; 

  Alert ($ ("#selectTest"). Val ()); 

   Alert ($ ("#selectTest option[@selected]"). text ()); 

   $ ("#selectTest"). attr ("Value", "2"); 

}); 

</script> 

 <ahrefahref= "#" >aaass</a> 

<!--dropdown box-->

1.<select id= "Selecttest" name= "Selecttest" >
2.<optionvalueoptionvalue= "1" >11</option>
3.<optionvalueoptionvalue= "2" >22</option>
4.<optionvalueoptionvalue= "3" >33</option>
5.<optionvalueoptionvalue= "4" >44</option>
6.<optionvalueoptionvalue= "5" >55</option>
7.<optionvalueoptionvalue= "6" >66</option>
8.</select>

9.jqueryradio value, checkbox value, select Value, Radio selected, CheckBox selected, select selected, and related to get a set of radio selected items value

10.var item = $ (' input[@name =items][@checked] '). Val ();

11. Get text of select selected item

12.var item = $ ("select[@name =items] option[@selected]"). Text ();

The second element of the 13.select drop-down box is the currently selected value

14.$ (' #select_id ') [0].selectedindex = 1;

The second element of the 15.radio Radio Group is the currently selected value

16.$ (' input[@name =items] '). Get (1). checked = true;

17. Get the value:

18. Text box, text area: $ ("#txt"). attr ("value");

19. Multi-selection box checkbox:$ ("#checkbox_id"). attr ("value");

20. Radio Group Radio: $ ("input[@type =radio][@checked]"). Val ();

21. Dropdown Box Select: $ (' #sel '). Val ();

22. Control the form elements:

23. Text box, text area: $ ("#txt"). attr ("Value", "");/empty content

$ ("#txt"). attr ("value", ' 11 ');//fill content

25. Multi-Marquee checkbox: $ ("#chk1"). attr ("Checked", "");/no tick.

$ ("#chk2"). attr ("Checked", true);/tick

if ($ ("#chk1"). attr (' checked ') ==undefined)//judge whether it has been ticked

28. Radio Group radio:$ ("input[@type =radio]"). attr ("Checked", ' 2 ');//Set value=2 project is currently selected

29. Drop-down Box select:$ ("#sel"). attr ("value", '-sel3 ');//Set VALUE=-SEL3 item as current selected

$ ("<optionvalueoptionvalue= ' 1 ' >1111</option><optionvalueoptionvalue= ' 2 ' >2222</OPTION&G t; "). Appendto ("#sel")/Tim

Option to add dropdown box

$ ("#sel"). empty ();//Empty Drop-down box

32. Gets the value of a set of radio selected items

33.var item = $ (' input[@name =items][@checked] '). Val ();

34. Get text of select selected item

35.var item = $ ("select[@name =items] option[@selected]"). Text ();

The second element of the 36.select drop-down box is the currently selected value

37.$ (' #select_id ') [0].selectedindex = 1;

The second element of the 38.radio Radio Group is the currently selected value

39.$ (' input[@name =items] '). Get (1). checked = true;

40. Get the value:

41. Text box, text area: $ ("#txt"). attr ("value");

42. Multi-selection box checkbox:$ ("#checkbox_id"). attr ("value");

43. Radio Group Radio: $ ("input[@type =radio][@checked]"). Val ();

44. Dropdown Box Select: $ (' #sel '). Val ();

45. Control the form elements:

46. Text box, text area: $ ("#txt"). attr ("Value", "");/empty content

47.$ ("#txt"). attr ("value", ' 11 ');/fill Content

48. Multi-Marquee checkbox: $ ("#chk1"). attr ("Checked", "");/no tick.

49.$ ("#chk2"). attr ("Checked", true);/tick

50.if ($ ("#chk1"). attr (' checked ') ==undefined)//judge whether it has been ticked

51. Radio Group radio:$ ("input[@type =radio]"). attr ("Checked", ' 2 ');//Set value=2 project is currently selected

52. Drop-down Box select:$ ("#sel"). attr ("value", '-sel3 ');//Set VALUE=-SEL3 item as current selected

53.$ ("<optionvalueoptionvalue= ' 1 ' >1111</option><optionvalueoptionvalue= ' 2 ' >2222</option > "). Appendto (" #sel ")//option to add a drop-down box

54.$ ("#sel"). empty ();//Empty dropdown box

Above this spring MVC in the AJAX implementation of two-level linkage is a simple example of the small series to share all the content, hope to give you a reference, but also hope that we support cloud habitat community.