在 ASP.Net MVC 中顯示來自服務器端驗證的成功驗證消息

Question

如果我的服務器端驗證通過，我想顯示一條從服務器傳回客戶端的消息。 可能會出現錯誤消息（在 ASP.Net MVC 中定義為屬性上的屬性），我可以顯示成功消息嗎？ 也許我可以利用 JQuery 驗證插件來做到這一點？

前任。 我從該位置進行查找以獲取我想將城市作為字符串傳回以將其顯示為驗證成功消息的城市。

這是我的代碼。

    [Required()]
    [MaxLength(5)]
    [MinLength(5, ErrorMessage = "Can't find location")]
    [Display(Name = "Zip code")]
    [Remote("CheckLocation", "Account", AreaReference.UseCurrent, ErrorMessage = "Invalid zipcode")]
    public string Location { get; set; }


    [HttpGet]
    [AllowAnonymous]
    public JsonResult CheckLocation(int Location)
    {
        var city = getLocation(Location);
        if (city != null)
        {
            // pass the city back with the JSon object, but how do I display it???
            return Json(true, JsonRequestBehavior.AllowGet);
        }
        return Json(false, JsonRequestBehavior.AllowGet);
    }

編輯這里是我試過的。 我現在使用 jQuery Validate 而不是我的c#屬性上的遠程屬性。 這工作正常，但如何在遠程定義成功屬性並將該成功消息傳遞給驗證消息？ 然后將顏色更改為綠色而不是紅色？

$('#Location').rules("add", {
  required: true,
  minlength: 5,
  maxlength: 5,
  messages: {
    required: "Required input",
    minlength: jQuery.validator.format("Please, {0} characters are necessary"),
    maxlength: jQuery.validator.format("Please, {0} characters are necessary")
  },
  remote: {
    url: "CheckLocation",
    type: "post",
    data: {
      Location: function() {
        return $('#Location').val();
      }
    }
  }
});

編輯 2我真的想顯示來自服務器的成功消息（例如，在輸入 zip 時向城市發送消息），所以我想我可以在遠程調用中使用成功回調，並在回調中操作消息顏色並制作元素有效。 我認為如果 JSon 響應中有字符串，validate 會將其設置為 false？

像這樣的東西。

        [HttpGet]
    [AllowAnonymous]
    public JsonResult CheckLocation(int Location)
    {
        var city = getLocation(Location);
        if (city != null)
        {
            return Json(city); // this will be text like "London"
        }
        return Json(false);
    }

$('#Location').rules("add", {
  required: true,
  //minlength: 5,
  maxlength: 5,
  messages: {
    required: "Required input",
    minlength: jQuery.validator.format("Please, {0} characters are necessary"),
    maxlength: jQuery.validator.format("Please, {0} characters are necessary")
  },
  remote: {
    url: "CheckLocation",
    type: "post",
    data: {
      Location: function() {
        return $('#Location').val();
      }
    },
    success: function(data) {
      // change the color from red to green for the message
      // make the invalid element valid so it passes submition
    }
  }
});

Answer 1

.validate()方法的success選項用於在驗證通過時控制消息元素。 默認情況下，驗證通過時隱藏錯誤消息。 使用success ，您可以修改此行為並在驗證通過時顯示圖標、消息等。 但是，此選項不會從您的服務器檢索消息。

jQuery Validate 是客戶端代碼，只有一種內置方法會從服務器獲取響應，那就是remote方法。 但是，這里的問題是您只能傳遞true以通過驗證，傳遞false以失敗驗證……如果您傳遞一個字符串，它會轉換為錯誤消息並且驗證失敗。

AFAIK，沒有內置的方法可以做你想做的事。 也許您可以編寫一個自定義success函數，使用.ajax()從您的服務器檢索消息。

---

總結：

1. 該插件通常不會顯示成功消息。 success選項是一種強制它顯示消息的方法。 但是，問題在於您無法將值傳遞給此選項。 這只是在字段有效時控制錯誤消息對象的一種方式。

2. 除了remote方法，插件通常不與服務器通信。 這樣做的問題是您只能通過true來通過驗證。 如果您傳遞一個字符串，驗證將失敗（並且該字符串成為驗證錯誤消息）。

---

編輯以回應 OP：

但是如何在遠程定義成功屬性並將該成功消息傳遞給驗證消息？

您只能使用success選項來正確操作錯誤元素。 但是，我認為您無法實現既定目標，因為似乎沒有辦法將字段的值傳遞給success選項。 否則，您可以success地使用.ajax()來檢索您的消息。

然后將顏色更改為綠色而不是紅色？

這是通過為valid和error類定義 CSS 屬性來自動完成的。 您還可以在success選項中使用.addClass()應用自定義類。

IMO，使用 jQuery Validate 插件無法實現您的整個目標。 但是，您應該徹底查看文檔以確保自己。

---

我認為如果 JSon 響應中有字符串，validate 會將其設置為 false？

是的，正如我在回答中所說的那樣。 如果服務器的響應比其他任何true的驗證是一套失敗。

Answer 2

你能做的是這個

使用ajax調用自定義action方法代替遠程數據注解

    var url = "/MyController/CheckLocation/";

$.ajax({
    url: url,
    data: { zipcode: _zipcode },
    cache: false,
    type: "POST",
    dataType: "json"
}).done(function (obgcity) {

     //If objcity is null then display error else display city
    }
});

Answer 3

我希望下面的代碼可以幫助你。

public ActionResult CheckLocation(int Location)
    {
        var city = getLocation(Location);
        if (city != null)
        {
            // city is string type, example: string city="Mumbai";
            return Json(new {Status=true, City = city}, JsonRequestBehavior.AllowGet);
        }
        return Json(new { Status=false, City=""}, JsonRequestBehavior.AllowGet);
    }

現在，正如 Sparky 在上面的消息中提到的，使用 ajax 調用您的操作或方法並編寫自定義成功函數

 var locationId = 20;
 $.ajax({
    url: "MyController/CheckLocation",
    data: { Location: locationId},
    cache: false,
    type: "GET",
    dataType: "json",
    success: function (data) {
             if(data.Status == true)
             {
                 alert(data.City); 
                // instead of alert you can create custom message alert box,
                // or if you want to display city name or whatever message
                // you can try $("#cityId").Html("<p>this is city</p>");   
             }        
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert("Ajax Failed!!!");
     }
});