使用json 和jQuery制作级联dropdownlist

联动式的下拉选择是一个很普遍的需求，在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.

本文来自云栖社区合作伙伴“doNET跨平台”，了解相关信息可以关注“opendotnet”微信公众号

相关资源：七夕情人节表白HTML源码(两款)