使用json 和jQuery制作级联dropdownlist

Posted 2022-10-24

联动式的下拉选择是一个很普遍的需求，在ASP.NET MVC中可以使用Json和jQuery来实现，更简单的是使用jQuery的级联插件CascadingDropDown ，具体参见文章http://...

联动式的下拉选择是一个很普遍的需求，在ASP.NET MVC中可以使用Json和jQuery来实现，更简单的是使用jQuery的级联插件CascadingDropDown ，具体参见文章​​http://weblogs.asp.net/rajbk/archive/2010/05/20/cascadingdropdown-jquery-plugin-for-asp-net-mvc.aspx​​。

  1: $(targetID).CascadingDropDown(sourceID, actionPath, settings) 
   2:  
   3: •targetID 
   4: The ID of the select list that will auto populate.  
   5:  
   6: •sourceID 
   7: The ID of the select list, which, on change, causes the targetID to auto populate. 
   8:  
   9: •actionPath 
  10: The url to post to 
  11: Options
  12:  
  13: •promptText 
  14: Text for the first item in the select list 
  15: Default : -- Select -- 
  16:  
  17: •loadingText 
  18: Optional text to display in the select list while it is being loaded. 
  19: Default : Loading.. 
  20:  
  21: •errorText 
  22: Optional text to display if an error occurs while populating the list 
  23: Default: Error loading data. 
  24:  
  25: •postData 
  26: Data you want posted to the url in place of the default 
  27: Example : 
  28: postData: function ()  
  29:     return  prefix: $(#txtPrefix).val(), customerID: $(#customerID).val() ; 
  30:  
  31: will cause prefix=foo&customerID=bar to be sent as the POST body. 
  32: Default: A text string obtained by calling serialize on the sourceID 
  33:  
  34: •onLoading (event) 
  35: Raised before the list is populated. 
  36:  
  37: •onLoaded (event) 
  38: Raised after the list is populated, The code below shows how to “animate” the  select list after load.