這篇文章給大家分享的是有關(guān)Asp.Net MVC4實(shí)現(xiàn)通過(guò)id更新表單內(nèi)容的方法是什么的內(nèi)容。小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧。
創(chuàng)新互聯(lián)公司主要從事成都網(wǎng)站建設(shè)、成都做網(wǎng)站、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)涪城,十余年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專(zhuān)業(yè),歡迎來(lái)電咨詢(xún)建站服務(wù):18982081108
用戶(hù)需求是:一個(gè)表單一旦創(chuàng)建完,其中大部分的字段便不可再編輯。只能編輯其中部分字段。
而不可編輯是通過(guò)對(duì)input輸入框設(shè)置disabled屬性實(shí)現(xiàn)的,那么這時(shí)候直接向數(shù)據(jù)庫(kù)中submit表單中的內(nèi)容就會(huì)報(bào)錯(cuò),因?yàn)橛行┎荒転閚ull的字段由于disabled屬性根本無(wú)法在前端被獲取而后更新至數(shù)據(jù)庫(kù)。
有下面兩種思路:
1.通過(guò)創(chuàng)建隱藏表單,為每一個(gè)disabled控件分別創(chuàng)建一個(gè)隱藏控件,但是這樣的問(wèn)題是工作量太大(如果表單有一千個(gè)屬性,你懂的)
2.通過(guò)獲取該表單在數(shù)據(jù)庫(kù)中的id,把該id和可以編輯的字段傳遞到后臺(tái)。首先通過(guò)id將對(duì)象及其屬性數(shù)據(jù)從數(shù)據(jù)庫(kù)中搜索出來(lái),然后將可以編輯的字段賦值給該對(duì)象。處理完畢后,再將該對(duì)象的數(shù)據(jù)更新至數(shù)據(jù)庫(kù)。
綜上所述,用第二種思路能顯得更加睿智。
下面是具體的操作步驟:(具體步驟就不用細(xì)看了,這是我從項(xiàng)目中抽出來(lái)的,只適合我自己回顧)
1.在OutsourcingModule.cs中創(chuàng)建路由,以此創(chuàng)建一個(gè)訪問(wèn)路徑:
routes.MapRoute( "OutSourcingWorkSheet",//路由名 "outsourcing/saveWorkSheet",//url路徑 new {controller = "Outsourcing", action = "SaveWorkSheet"}//映射的控制器以及對(duì)應(yīng)的Action方法名 );
2.
////// 保存工作票 /// ModelBinder會(huì)將前端傳遞過(guò)來(lái)的id在數(shù)據(jù)庫(kù)中搜索出字段并且轉(zhuǎn)換為outsourcing對(duì)象 /// 此時(shí)的outsourcing對(duì)象中的workSheets屬性不是前端傳遞過(guò)來(lái)的值,而是數(shù)據(jù)庫(kù)中的 /// /// 方法中有兩個(gè)參數(shù),outsourcing上面已經(jīng)解釋?zhuān)瑆orkSheets是前端傳遞過(guò)來(lái)的第二個(gè)參數(shù) /// /// /// ///[HttpPost] [ActionName("SaveWorkSheet")] [AccessRestriction("SaveWorkSheet")] public JsonResult SaveWorkSheet(Outsourcing outsourcing,string workSheets) { if (outsourcing!=null) { outsourcing.WorkSheets = workSheets; _outsourcingService.Save(outsourcing); return Json(new ABResponse(HttpStatusCode.OK)); } return Json(new ABResponse(HttpStatusCode.BadRequest)); }//AB為內(nèi)部項(xiàng)目
3.前端js腳本代碼
$('#btn_saveWorkSheet').on('click', function () { if ($("input[name=workSheets]").val() == "") { bootbox.alert("不能為空"); } else { $.ajax({ type: "post", url: "/outsourcing/saveWorkSheet", data: { ID: $("#outsourcing_id").val(), WorkSheets: $("input[name=workSheets]").val() }, dataType: "json", success: function (data) { if (data.Code == 200) { bootbox.alert("修改成功,即將刷新"); setTimeout(function () { location.reload(); }, 1000); } else { bootbox.alert("提交失敗,請(qǐng)稍后再試"); } } }); } });
其實(shí)思路很簡(jiǎn)單,但是我特么做了大半天- -;其中還遇到了一個(gè)大坑:
在第二段代碼的參數(shù)列表中,我一開(kāi)始把string workSheets寫(xiě)成了WorkSheets。這時(shí)文字下出現(xiàn)了藍(lán)色的波浪線,Alt+Enter后系統(tǒng)提示Rename to workSheets,我便直接回車(chē)確定了。然后,WorkSheets字段便再也無(wú)法保存,也不能從數(shù)據(jù)庫(kù)中讀取。在同事幫忙找了N久之后發(fā)現(xiàn),原來(lái)是當(dāng)時(shí)大寫(xiě)改小寫(xiě)的過(guò)程中同時(shí)將dbml文件中的字段也改成了小寫(xiě)導(dǎo)致了無(wú)法和數(shù)據(jù)庫(kù)匹配。
做這個(gè)功能的時(shí)候順便學(xué)到的一點(diǎn)知識(shí):
如果一個(gè)input的id為apple,那么可以這么獲取,這是我本來(lái)就知道的:
var apple = $("#apple").val();
如果一個(gè)input的name為apple,那么可以這么獲取,這是我剛知道的:
var apple = $("input[name=apple]").val();
還有一個(gè)剛知道的,如果從很多input中去除某個(gè)name:
$("#fruit").find("input:not(input[name=apple]),textarea,select").attr("disabled", true); //從id為fruit的父元素里面尋找所有的input、textarea和select控件以及其值,但是除去name為apple的控件
另外總結(jié)下ajax的方式,很久不用都快忘了:
$.ajax({ type:"post",//可以選擇post或者method url:"",//url接口 data:{ //參數(shù)列表 }, success:function(data){ //如果訪問(wèn)url成功,data就是該url接口自動(dòng)返回的數(shù)據(jù) } })
感謝各位的閱讀!關(guān)于Asp.Net MVC4實(shí)現(xiàn)通過(guò)id更新表單內(nèi)容的方法是什么就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!