HTML page Select drop-down list box in another way, a method once and for all.

Many times, we write the from table on one side and assign values to the select tag in this way:
Create a public partial view in 1.MVC;
2. Directly in the foreground, insert the snippet background code;
Today I use the custom attribute in HTML5, combined with the JQ extension method, write a general JS method,
The JS code is as follows:

  $.fn.            Setselect = function () {return This.each (function () {var select = $ (this);            var url = $ (this). attr ("Data-ajax");             var value = $ (this). attr ("data-selected");            Select.empty ();                    if (typeof url!== typeof undefined && typeof value!== typeof undefined) {$.ajax ({                    Type: "POST", Url:url, Async:false, DataType: "JSON",                            Success:function (Result) {for (var i = 0; i < result.length; i++) {                        Select.append ("<option value=" + Result[i].value + ">" + result[i].name + "</option>");                    } select.val (value);            },                });    }        }); };

On the front page:
<select class= "Form-control" name= "MenuID"
Data-ajax= "@Url. Action (" Getmenuinfo ", new {ModuleID = Model.moduleid})"
Data-selected= "@Model. MenuID" required></select>

                                    <script>

Initialization
$ ("Select[name= ' MenuID ')". Setselect ();
</script>

                                    好了，到此结束，我们前台代码是不是很少，所有的select都可以调用，只是传不同的数据源URL即可

HTML page Select drop-down list box in another way, a method once and for all.