MVC動態(tài)拼接頁面

? ? ? ? ? MVC動態(tài)的拼接頁面，根據用戶的事件動態(tài)的加載要顯示的數據到頁面，如下

? ? ? ? ??首先，在頁面寫一個控件

? ? ? ? ??<form id="frm"></form>

? ? ? ? ??然后在JS中寫代碼，調用后臺的數據，JS中使用控件InnerHTML方法

function selectOnchang(obj) {//獲取被選中的option標簽選項var Num =obj.selectedIndex;var bb =document.getElementById("frm");bb.innerHTML= "";$.ajax({type:"POST",url:"/QueryResult/QueryInfo",//傳遞的參數data:{"Num": Num, },//傳入控件的字符串success: function (data) {console.log(data);bb.innerHTML = data; }}) }

? ? ? ? ??最后，在Controller中寫方法，查詢數據返回拼接的字符串。

public string QueryInfo(string Num){//獲取試題ID//string Num = Request.QueryString["Num"];//獲取所有的審批，按時間排序List<QueryResultViewModel> Info = QueryAllType(Num);//獲取審批個數int Number = Info.Count;//初始化strHTMLStringBuilder strRadioBtn = new StringBuilder();//循環(huán)遍歷，動態(tài)拼接for (int i = 0; i < Number; i++){strRadioBtn.Append("<div class=\"panel panel-default\"style=\"width:1075px; margin-left:10px;\">");strRadioBtn.Append("<div class=\"panel-heading\">審批類型—" + Info[i].departmentName + "<span style=\"margin-left:820px\">狀態(tài)："+ Info[i].accumulateStates + "</span>" +"</div>");strRadioBtn.Append("<divclass=\"panel-body\">");strRadioBtn.Append("<div>");strRadioBtn.Append("<span >用戶名："+ Info[i].userName + "</span>");strRadioBtn.Append("</div>");strRadioBtn.Append("<divstyle=\"float:left;margin-left:820px;margin-top:-20px;\">");strRadioBtn.Append("<span >上傳日期："+ Info[i].date + "</span><br>");strRadioBtn.Append("</div>");strRadioBtn.Append("<span >審批內容："+ Info[i].accumulateDescription + "</span><br>");strRadioBtn.Append("<span >回復內容："+ Info[i].operaterResponse + "</span><br>");strRadioBtn.Append("<div>");strRadioBtn.Append("<span >審批人："+ Info[i].operaterName + "</span>");strRadioBtn.Append("</div>");strRadioBtn.Append("<divstyle=\"float:left;margin-left:820px;margin-top:-20px;\">");strRadioBtn.Append("<span >審批日期："+ Info[i].operaterDate + "</span>");strRadioBtn.Append("</div>");strRadioBtn.Append("</div>");strRadioBtn.Append("</div>");}//返回頁面return strRadioBtn.ToString();}

總結

以上是生活随笔為你收集整理的MVC动态拼接页面的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。