MVC實(shí)現(xiàn)下拉框聯(lián)動效果(單選)
下拉框聯(lián)動效果,我們以部門--職位為例,選擇部門時,關(guān)聯(lián)到該部門的職位.下拉框的寫法就不多說了,詳細(xì)請參照前文.
視圖:
其中,dept是部門的屬性,deptlist是部門下拉框的屬性,job是職位的屬性,joblist是職位下拉框的屬性,下拉框綁定請參照前文
@using (Html.BeginForm("aaai003sch", "aaa", FormMethod.Post, new { @class = "form-horizontal", role = "form" })) { @Html.AntiForgeryToken() <div class="modal-body"> <div class="form-horizontal"> <div class="form-group"> @Html.LabelFor(m => m.dept, new { @class = "col-sm-2 control-label" }) <div class="col-sm-10"> @Html.DropDownListFor(model => model.dept, Model.deptlist, new { @class = "form-control select2 ", style = "width: 100%;" }) @Html.ValidationMessageFor(m => m.dept, "", new { @class = "text-danger" }) </div> </div> <div class="form-group"> @ Html.LabelFor(m => m.job, new { @class = "col-sm-2 control-label" }) <div class="col-sm-10"> @Html.DropDownListFor(model => model.job, Model.joblist, new { @class = "form-control select2 page-select2-area", style = "width: 100%;" }) @Html.ValidationMessageFor(m => m.job, "", new { @class = "text-danger" }) </div> </div> </div> </div> </div>
當(dāng)部門變動的時候,職位也相應(yīng)改變:
//根據(jù)城市獲取酒店 $("#dept").change(function () { var url = rootUrl + "aaa/GetJobByDept"; var dept = $(this).val(); //獲取部門的值 var job = $("#job"); job.empty(); //清空當(dāng)前職位的值 //這句很重要,因我們用的是select2插件,若沒有用這個插件可以去掉這句 job.select2('val', ''); $.ajax({ cache: false, type: "GET", url: url, data: { "Dept": dept}, success: function (data) { $.each(data, function (id, option) { job.append($('<option></option>').val(option.Id).html(option.Name)); }); job.trigger('change'); }, error: function (xhr, ajaxOptions, thrownError) { toastr["error"]("請選擇部門"); } }); });
執(zhí)行js里的URL,這個程式寫在控制器里:
[Description("根據(jù)部門獲取職位")] [AcceptVerbs(HttpVerbs.Get)] [LoginAllowView] public ActionResult GetJobByDept(string dept) { if (String.IsNullOrEmpty(dept)) { throw new ArgumentNullException("dept"); } StringBuilder sb = new StringBuilder(); sb = new StringBuilder(); sb.Append(" SELECT jobid,jobname "); sb.Append(" FROM job_file "); sb.Append(" LEFT JOIN dept_file ON jobdept = deptid "); sb.AppendFormat(" WHERE deptid='{0}'", dept); DataTable dt = sqlHelper.getData(sb.ToString()); var result = dt.AsEnumerable().Select(row => new Item { Name = Utils.ObjToStr(row["jobname"]), Id = Utils.ObjToInt(row["jobid"], 0) }).ToList(); return Json(result, JsonRequestBehavior.AllowGet); }
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 詳解ASP.NET MVC之下拉框綁定四種方式
- ASP.NET MVC下拉框聯(lián)動實(shí)例解析
- asp.net mvc下拉框Html.DropDownList 和DropDownListFor的常用方法
- 基于MVC3方式實(shí)現(xiàn)下拉列表聯(lián)動(JQuery)
- asp.net 自制的單選、多選列表實(shí)現(xiàn)代碼
- 在.net中用CheckBoxList實(shí)現(xiàn)單選
- asp.net中js+jquery添加下拉框值和后臺獲取示例
- ASP.NET中DropDownList下拉框列表控件綁定數(shù)據(jù)的4種方法
- asp.net 實(shí)現(xiàn)下拉框只讀功能
- MVC5下拉框綁定的方法(單選)
相關(guān)文章
ASP.net 動態(tài)加載控件時一些問題的總結(jié)
經(jīng)常見到有人說在ASP.net中不要使用動態(tài)控件,我想主要的原因在于使用動態(tài)控件會帶來一些問題,在做項(xiàng)目的過程中,我將由動態(tài)加載控件引發(fā)的總是作了一個小小的總結(jié).2009-04-04ASP.NET Core讀取Request.Body的正確方法
相信大家在使用ASP.NET Core進(jìn)行開發(fā)的時候,肯定會涉及到讀取Request.Body的場景,畢竟我們大部分的POST請求都是將數(shù)據(jù)存放到Http的Body當(dāng)中,本文就介紹一下ASP.NET Core讀取Request.Body,感興趣的可以了解一下2021-05-05asp.net顯示圖片到指定的Image控件中 具體實(shí)現(xiàn)
這篇文章介紹了asp.net顯示圖片到指定的Image控件中 具體實(shí)現(xiàn),有需要的朋友可以參考一下2013-11-11用.NET 2.0壓縮/解壓功能處理大型數(shù)據(jù)
用.NET 2.0壓縮/解壓功能處理大型數(shù)據(jù)...2006-09-09在ASP.NET中,設(shè)置Session的過期時間的方法
在ASP.NET中,設(shè)置Session的過期時間的方法,需要的朋友可以參考下2012-12-12GridView控件實(shí)現(xiàn)數(shù)據(jù)的顯示和刪除(第8節(jié))
這篇文章主要介紹了GridView控件實(shí)現(xiàn)數(shù)據(jù)的顯示和刪除,以新聞網(wǎng)站為例,實(shí)現(xiàn)對新聞數(shù)據(jù)的操作,了解各種數(shù)據(jù)源控件與數(shù)據(jù)綁定控件的類型和作用,需要的朋友可以參考下2015-08-08