动态部分视图+ jquery表单劫持+客户端验证=不工作 [英] Dynamic partial view + jquery form hijack + client validation = not working

问题描述

我有一个可以点击的行的表。单击时，我想启动动态加载的部分视图。这是代码：

  function GetStuff（id）{
 $ .ajax（
 { 
 url：编辑/+ id，
成功：function（result）{
 $（＃DivTest）。html（result）; 
} 
 }）; 
} 
  

这一切都有效。
问题是当我试图保存部分使用jquery的东西。表单被劫持，像这样：

  $（function（）{
 $ .post（$（this） .attr（action），
 $（this）.serialize（），
函数（data）{
 alert（test）; 
}）; 
 e.preventDefault（）; 
}）; 
  

这一切使客户端验证无效。即使我已经删除了一些所需的值，它也会发布。如果我没有使用ajax发布，或者如果部分在页面加载（不是动态的）加载，这一切都会起作用。

---

我曾尝试过的：

我试过把这个放在帖子之前：

 code> if（$（'form'）。validate（）。form（））{
 ... 
} 
  

这只是每次都返回true ..

从这篇文章我得到2个建议
<一个href =https://stackoverflow.com/questions/2652586/asp-net-mvc-2-loading-partial-view-using-jquery-no-client-side-validation> ASP.NET MVC 2加载部分查看使用jQuery - 没有客户端验证

添加

  Sys.Mvc.FormContext._Application_Load（）; 
  

部分加载后$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $％ HTML。没有工作。

我也尝试过没有运气的方法：
http://www.deepcode.co.uk/2010/08/mvc-ootb-validation-when-pulling-in .html

这种组合技术是非常常见的，我猜，为什么这么难以使它工作？任何帮助是非常感谢。
谢谢

解决方案

在新形式的successfull ajax加载之后，您必须指示不显眼的验证库来解析新表单通过手动调用：

  //先将新表单插入到DOM中，然后调用：
 $。 validator.unobtrusive.parse（'< form selector>'））; 
 $（'< form selector>'）。validate（）; //开始验证
  

根据data-xxx属性设置jquery.validation验证器形成子元素。

之后调用 $（'< form selector>'）。validate（）。form（）应该按预期工作！

I'm using MVC 3 with unobtrusive javascript for client validation.

I have a table with rows which are clickable. When clicked I want to bring up a dynamically loaded partial view. This is the code for this:

function GetStuff(id) {
    $.ajax(
    {
        url: "Edit/" + id,
        success: function (result) {
            $("#DivTest").html(result);
        }
    });
}

This far everything works. The problem is when I'm trying to save something in the partial using jquery. The form is hijacked, like this:

$(function () {
    $.post($(this).attr("action"),
        $(this).serialize(),
        function (data) {
            alert("test");
        });
    e.preventDefault();
});

This all together makes the client validation not work. It just makes the post even if I have left out some required values. This all works if I'm not using ajax to post or if the partial is loaded on page load (not dynamic).

---

What I've tried:

I tried putting this before the post:

if($('form').validate().form()){
    ...
}

This just returns true every time though..

From this post i got 2 suggestions ASP.NET MVC 2 loading partial view using jQuery - no client side validation

Adding

Sys.Mvc.FormContext._Application_Load(); 

after the partial has been loaded.. And set the datatype of the post to "html". Neither worked.

I also tried this method with no luck: http://www.deepcode.co.uk/2010/08/mvc-ootb-validation-when-pulling-in.html

This combination of techniques are something very common I guess, why is it so hard to make it work? Any help is highly appreciated. Thank you

解决方案

Upon the successfull ajax load of the new form you have to instruct the unobtrusive validation library to parse the new form by manually calling:

// insert new form into the DOM first, then call:
$.validator.unobtrusive.parse('<form selector>'));
$('<form selector>').validate(); // start validating

This sets up the jquery.validation validators according to the data-xxx attribute in the forms child elements.

After that the call $('<form selector>').validate().form() should work as expected!

这篇关于动态部分视图+ jquery表单劫持+客户端验证=不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！