ASP.NET MVC 2使用jQuery加载局部视图 - 没有客户端验证

Question

我使用jQuery.load()来呈现局部视图。 这部分看起来像这样：

$('#sizeAddHolder').load(
                '/MyController/MyAction', function () { ... });

我的控制器中的操作代码如下：

    public ActionResult MyAction(byte id)
    {
        var model = new MyModel
        {
            ObjectProp1 = "Some text"
        };

        return View(model);
    }

    [HttpPost]
    public ActionResult MyAction(byte id, FormCollection form)
    {
        // TODO: DB insert logic goes here

        var result = ...;

        return Json(result);
    }

我返回的部分视图看起来像这样：

<% using (Html.BeginForm("MyAction", "MyController")) {%>
    <%= Html.ValidationSummary(true) %>

    <h3>Create my object</h3>

    <fieldset>
        <legend>Fields</legend>

        <div class="editor-label">
            <%= Html.LabelFor(model => model.ObjectProp1) %>
        </div>
        <div class="editor-field">
            <%= Html.TextBoxFor(model => model.Size.ObjectProp1) %>
            <%= Html.ValidationMessageFor(model => model.ObjectProp1) %>
        </div>

        div class="editor-label">
            <%= Html.LabelFor(model => model.ObjectProp2) %>
        </div>
        <div class="editor-field">
            <%= Html.TextBoxFor(model => model.ObjectProp2) %>
            <%= Html.ValidationMessageFor(model => model.ObjectProp2) %>
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>

<% } %>

在这种情况下，客户端验证不起作用。 更重要的是，包含验证消息的脚本也不包含在返回的视图中。 我的模型类中的两个属性都具有Required和StringLength属性。 有没有办法在这样加载的视图中触发客户端验证？

Answer 1

首先，您应该返回部分视图而不是视图。

return PartialView(model);

其次，您是否尝试使用AJAX加载此局部视图？ 在这种情况下，您可能希望使用jquery.ajax

function ajax_update(path)
  $.ajax {
    url: path,
    success: function(result) {
      $('#sizeAddHolder').html(result);
    }
  return false;
}

Answer 2

您应该在ajax调用上使用dataType

function ajax_update(path)
  $.ajax {
    url: path,
    dataType: "html",
    success: function(result) {
      $('#sizeAddHolder').html(result);
    }
  return false;
}

来自jQuery文档 ：

dataType默认值：智能猜测（xml，json，script或html）

您期望从服务器返回的数据类型。 如果没有指定，jQuery将智能地尝试获取结果，基于响应的MIME类型（XML MIME类型将产生XML，在1.4 JSON中将产生一个JavaScript对象，在1.4脚本中将执行脚本，以及任何东西else将作为字符串返回）。 可用的类型（以及作为成功回调的第一个参数传递的结果）是：

* "xml": Returns a XML document that can be processed via jQuery.
* "html": Returns HTML as plain text; included script tags are evaluated when inserted in the DOM.
* "script": Evaluates the response as JavaScript and returns it as plain text. Disables caching unless option "cache" is used. Note: This will turn POSTs into GETs for remote-domain requests.
* "json": Evaluates the response as JSON and returns a JavaScript object. In jQuery 1.4 the JSON data is parsed in a strict manner; any malformed JSON is rejected and a parse error is thrown. (See json.org for more information on proper JSON formatting.)
* "jsonp": Loads in a JSON block using JSONP. Will add an extra "?callback=?" to the end of your URL to specify the callback.
* "text": A plain text string.

Answer 3

我不确定你是否还在回答你的问题，但我写了一篇关于使AJAX加载表单与ASP.NET MVC 2中的客户端验证一起工作的帖子： http ： //tpeczek.com/2010/ 04 /制造-ASPNET-MVC -2-客户side.html

Answer 4

问题是加载ajax的表单永远不会在Microsoft验证中注册。 要解决它，请调用以下函数Sys.Mvc.FormContext._Application_Load。

function ajax_update(path)
  $.ajax {
    url: path,
    success: function(result) {
      $('#sizeAddHolder').html(result);
      Sys.Mvc.FormContext._Application_Load();
    }
  return false;
}

那应该解决它。 另外，请确保通过ajax加载的表单具有唯一的ID。 否则，验证将失败。

避免使用load（）。 它会删除响应中加载的所有脚本。

Answer 5

这是适用的： asp-net-mvc-client-side-validation-with-dynamic-contents

Answer 6

在html文件中，您可以使用以下内容：

对不起，但我不知道如何发布链接HTML。 and a href = "javascript:;" 所以你可以有一个链接class =“delete”， id = 和一个href =“javascript：;”

然后我用这个函数渲染局部视图：

 $(".delete").click(function(event){
          var id = $(".select").attr("id");
          var id2 = event.target.id;
          $.ajax({
                url: "Persona/Delete?idPersona=" + id2.toString(),
                success: function (data) {
                    $("#popUpConfirmar").html(data);
                }
            });

            dialogoPopUp.dialog("open");
        });

请记住，在控制器中，您必须执行以下操作：

    public PartialViewResult Delete(int idPersona)
    {
        PersonaDataAccess personaDataAccess = new PersonaDataAccess();
        Persona persona = personaDataAccess.GetOne(idPersona);
        return PartialView("Delete",persona);
    }