Asp.Net MVC4通過id更新表單

来源:http://www.cnblogs.com/chenyangsocool/archive/2017/07/17/7195729.html
-Advertisement-
Play Games

用戶需求是:一個表單一旦創建完,其中大部分的欄位便不可再編輯。只能編輯其中部分欄位。 而不可編輯是通過對input輸入框設置disabled屬性實現的,那麼這時候直接向資料庫中submit表單中的內容就會報錯,因為有些不能為null的欄位由於disabled屬性根本無法在前端被獲取而後更新至資料庫。 ...


用戶需求是:一個表單一旦創建完,其中大部分的欄位便不可再編輯。只能編輯其中部分欄位。

而不可編輯是通過對input輸入框設置disabled屬性實現的,那麼這時候直接向資料庫中submit表單中的內容就會報錯,因為有些不能為null的欄位由於disabled屬性根本無法在前端被獲取而後更新至資料庫。

有下麵兩種思路:

1.通過創建隱藏表單,為每一個disabled控制項分別創建一個隱藏控制項,但是這樣的問題是工作量太大(如果表單有一千個屬性,你懂的)

2.通過獲取該表單在資料庫中的id,把該id可以編輯的欄位傳遞到後臺。首先通過id將對象及其屬性數據從資料庫中搜索出來,然後將可以編輯的欄位賦值給該對象。處理完畢後,再將該對象的數據更新至資料庫。

 

綜上所述,用第二種思路能顯得更加睿智。

下麵是具體的操作步驟:(具體步驟就不用細看了,這是我從項目中抽出來的,只適合我自己回顧)

 

1.在OutsourcingModule.cs中創建路由,以此創建一個訪問路徑:

routes.MapRoute(
    "OutSourcingWorkSheet",//路由名
    "outsourcing/saveWorkSheet",//url路徑
    new {controller = "Outsourcing", action = "SaveWorkSheet"}//映射的控制器以及對應的Action方法名
);

 

2.

/// <summary>
/// 保存工作票
/// ModelBinder會將前端傳遞過來的id在資料庫中搜索出欄位並且轉換為outsourcing對象
/// 此時的outsourcing對象中的workSheets屬性不是前端傳遞過來的值,而是資料庫中的
/// 
/// 方法中有兩個參數,outsourcing上面已經解釋,workSheets是前端傳遞過來的第二個參數
/// </summary>
/// <param name="outsourcing"></param>
/// <param name="workSheets"></param>
/// <returns></returns>
[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為內部項目

 

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("提交失敗,請稍後再試");
                }
            }
        });
    }
});

 

其實思路很簡單,但是我特麽做了大半天- -;其中還遇到了一個大坑:

在第二段代碼的參數列表中,我一開始把string workSheets寫成了WorkSheets。這時文字下出現了藍色的波浪線,Alt+Enter後系統提示Rename to workSheets,我便直接回車確定了。然後,WorkSheets欄位便再也無法保存,也不能從資料庫中讀取。在同事幫忙找了N久之後發現,原來是當時大寫改小寫的過程中同時將dbml文件中的欄位也改成了小寫導致了無法和資料庫匹配。

 

做這個功能的時候順便學到的一點知識:

如果一個input的id為apple,那麼可以這麼獲取,這是我本來就知道的:

var apple = $("#apple").val();

如果一個input的name為apple,那麼可以這麼獲取,這是我剛知道的:

var apple = $("input[name=apple]").val();

還有一個剛知道的,如果從很多input中去除某個name:

$("#fruit").find("input:not(input[name=apple]),textarea,select").attr("disabled", true);
//從id為fruit的父元素裡面尋找所有的input、textarea和select控制項以及其值,但是除去name為apple的控制項

 

另外總結下ajax的方式,很久不用都快忘了:

$.ajax({
    type:"post",//可以選擇post或者method
    url:"",//url介面
    data:{
        //參數列表
    },
    success:function(data){
        //如果訪問url成功,data就是該url介面自動返回的數據
    }
})

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 開頭添加變數: Point mouseOff;//滑鼠移動位置變數 bool leftFlag;//標簽是否為左鍵 事件部分: ps:很常用的幾串字元。 記住! 記住! 記住! ...
  • 前言: 本文主要是介紹了Nunit的基本使用,其中參詳了很多已有的文章,由於最近要使用其進行測試,所以對網上的文章做了下整理,同時加入了一些自己的實踐。 NUnit的屬性 TestFixture 它標記一個類包含測試,申明該類是用來測試的。一般用在class的定義之前; Test 一般是放在meth ...
  • 一、前言 最近公司新項目,需要搭架構進行開發,其中需要保證事務的一致性,經過一番查找,發現很多博文都是通過Spring.Net、Unity、PostSharp、Castle Windsor這些方式實現AOP的。但是這不是我想要的,因此一番查找後,使用 該方式實現AOP。 二、使用AOP的優勢 博主覺 ...
  • 1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Text; 5 using System.Threading.Tasks; 6 7 namespace ClassDemo ... ...
  • C# 將Access中時間段條件查詢的數據添加到ListView中 一、讓ListView控制項顯示表頭的方法 在窗體中添加ListView 空間,其屬性中設置:View屬性設置為:Detail,Columns集合中添加表頭中的文字。 二、利用代碼給ListView添加Item。 首先,ListVie ...
  • 一、Docker for Windows 基礎知識 1. 下載docker for windows。 "docker for windows" 2. 下載安裝完後設置"Shared Drives"。 3. 因為國內訪問docker story太慢。需要設置docker加速器: "Daemon" Re ...
  • Quartz.net是作業調度框架 1. 項目中添加quartz.net的引用(這裡使用nuget管理) 新建一個類TimingJob,該類主要用於實現任務邏輯 在Program.cs中:(這裡是控制台應用程式) 程式運行時,經過5秒後,每間隔2秒輸出信息 Cron表達式: quartz.NET中的 ...
  • .Net中的System.Configuration命名空間為我們在web.config或者app.config中自定義配置提供了完美的支持。最近看到一些項目中還在自定義xml文件做程式的配置,所以忍不住寫一篇用系統自定義配置的隨筆了。 如果你已經對自定義配置瞭如指掌,請忽略這篇文章。 言歸正傳, ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...