Use jQuery to achieve the linkage effect of dropdownlist (sharepoint 2007)_jquery

Usage scenario, for example, select a province, and then the corresponding city will be displayed in the lower-level list.

1. Use Jquery-1.4.2.js and jquery.SPServices-0.5.7.js.

2. Create the main table and sub-table and establish the corresponding relationship.

3. Add Content Editor Webpart in List’s NewItem or EditItem page, and then add script code there.

4. Implementation,

dropdownObjControl:

cascadeDropdownObj control (this control is attached via script):

This method returns the records of the word table by passing in parameters

Copy code The code is as follows:

function GetSubDropdown(parameterVal){
cascadeDropdownObj.empty();//Initially clear the subordinate list
cascadeDropdownObj.append("(None) ");//Add a (None) value
var camlQuery = "
< ;Where>


" parameterVal "
< /Eq>

";
$().SPServices({
operation: "GetListItems",
async: false,
listName: "CascadeSub",
CAMLQuery: camlQuery,
completefunc: function (xData, Status) {
$(xData.responseXML).find("[nodeName=z:row]").each( function() {
var subDropdownVal = $(this).attr("ows_SubDropdownVal");//Get the value corresponding to the word table
//binding subDropdown
cascadeDropdownObj.append("" subDropdownVal "");
});
}
});
}
//cascading 'Dropdown'
dropdownObj.change(function(){
var dropdownSelectTextObj = $("select[title$='Dropdown'] option:selected");//Get the current selected value
switch(dropdownSelectTextObj.text()){
case "L1":
GetSubDropdown("L1");
break;
case "L2":
GetSubDropdown("L2");
break;
case "PL1":
GetSubDropdown ("PL1");
break;
default: //Indicates that after selecting the (None) value, the lower-level list is initially cleared
cascadeDropdownObj.empty();
cascadeDropdownObj.append("< ;option selected='selected'>(None)");
break;
}
});