Asp.net-Mvc

與 jquery ajax 序列化的模型綁定不起作用

  • February 23, 2022

我有以下模型:

public class RegisterUseraccount
{
   [Required]
   [DataType(DataType.EmailAddress)]
   [Display(Name = "E-Mail-Adresse")]
   public string Email { get; set; }

   [Required]
   [Display(Name = "Vorname")]
   public string FirstName { get; set; }

   [Required]
   [Display(Name = "Nachname")]
   public string LastName { get; set; }

   [Required]
   [DataType(DataType.Password)]
   [MinLength(5)]
   [Display(Name = "Passwort")]
   public string Password { get; set; }

   ...
}

以及以下觀點:

@using (Html.BeginForm("Register", "Useraccount", FormMethod.Post, new { id = "registerUseraccountForm", @class = "ym-form" }))
{
   @Html.ValidationSummary(true)        

   <div class="ym-grid">
       <div class="ym-g50 ym-gl">
           <div class="ym-fbox-text">
               @Html.LabelForRequired(model => model.RegisterUseraccount.FirstName, null)               
               @Html.EditorFor(model => model.RegisterUseraccount.FirstName, new { required = "required", name = "firstName" })
               @Html.ValidationMessageFor(model => model.RegisterUseraccount.FirstName)                  
           </div>
       </div>
   ...

和我的 JavaScript

function sendForm(target) {
   alert(data);
   $.ajax({
       url: target,
       type: "POST",
       contentType: 'application/json',
       data: $("#registerUseraccountForm").serialize(),
       success: ajaxOnSuccess,
       error: function (jqXHR, exception) {
           alert('Error message.');
       }
   });

這是序列化的結果:

RegisterUseraccount.FirstName=Peter&RegisterUseraccount.LastName=Miller&RegisterUseraccount.Email=miller%40gmail.com&RegisterUseraccount.Password=admin

這是我試圖發佈到的控制器方法:

[HttpPost]
public ActionResult Register(RegisterUseraccount registerUseraccount)
{
   ...
}

…但是數據沒有到達方法,我收到錯誤404。我認為modelbinder無法工作。

有效的是使用名稱 firstName=Peter 發送的數據,但實際發送的是 RegisterUseraccount.FirstName=Peter。

我該如何處理這個問題?

刪除contentType: 'application/json',並修改它更好(從我的角度來看)

$('#registerUseraccountForm').submit(function () {
   if ($(this).valid()) {
       $.ajax({
           url: this.action,
           type: this.method,
           data: $(this).serialize(),
           beforeSend: function () {

           },
           complete: function () {

           },
           ...

也許你有這個模型

public class YourModel
{
   public RegisterUseraccount RegisterUseraccount { get; set; }
}

在這種情況下,您必須放置與您的操作相對應的模型:

[HttpPost]
public ActionResult Register(YourModel model)
{
   var registerUseraccount = model.RegisterUseraccount;
   ...
}

或者:

@using (Html.BeginForm("Register", "Useraccount", FormMethod.Post, new { id = "registerUseraccountForm", @class = "ym-form" }))
{
  @{ Html.RenderPartial("RegisterUseraccount"); }
}

RegisterUseraccount.cshtml

@model YourNamespace.RegisterUseraccount

@Html.ValidationSummary(true)        

<div class="ym-grid">
   <div class="ym-g50 ym-gl">
       <div class="ym-fbox-text">
           @Html.LabelForRequired(model => model.FirstName, null)               
           @Html.EditorFor(model => model.FirstName, new { required = "required", name = "firstName" })
           @Html.ValidationMessageFor(model => model.FirstName)                  
       </div>
   </div>

但是您必須更改一些內容,例如@Html.ValidationSummary (true).

編輯

或者最簡單的:

data: $("#registerUseraccountForm").serialize().replace("RegisterUseraccount.",""),

編輯二

data: $("#registerUseraccountForm").serialize().replace(/RegisterUseraccount./g,""),

引用自:https://stackoverflow.com/questions/16717715