ASP.Net +的jQuery + jQuery验证插件+的UpdatePanel + nyroModal - 成功发射上的每个字段！

StackOverflow https://stackoverflow.com/questions/850777

题

我有一个包含用户和价格（数字）填充输入字段的列表的形式。我已经设置了CSS类为“需要”和“数量”，使jQuery的验证插件因此对它们进行验证。所有这一切都工作得很好。的错误显示当每个字段是不是数字或值丢失等

此整个形式实际上是一个nyroModal（jQuery插件）模型弹出窗口内部。但是，这不应该的问题，它只是一个.aspx Web表单不管。在那，我也用一个UpdatePanel，并把里面的一切，因为我的形式基本上是一个2阶段过程。有一些基本的步骤，用户必须在表格的第一“页”上完成。当验证并工作，我只隐藏/显示在UpdatePanel内的一些元件以示出用户的下一个“页面”的形式，这是因为如上所述的所有文本框价格输入字段。

我正在使用的ImageButton作为触发点，用于验证的形式。默认情况下，如果你只是离开了ImageButton的事情是这样的，.NET可以断火回传，回传AJAX在我的情况，因为其所有的UpdatePanel内发生的事情。再次，是理想的。我不想出于显而易见的原因丑陋完全回发。

在大量的阅读中，我需要一种方法来连接到.NET的PageRequestManager在javascript，这样我可以拦截时的.Net想做回发的基础上，如果jQuery的已成功验证了表单。所以我的逻辑说：默认情况下，不允许回发，但是当jQuery的成功验证的形式，设置一个变量，它说，回发现在允许，然后回传尝试发生下一次，它会经过。因此显示成功给用户。

这是一种所有工作还算不错，但有一个最后的问题。

在jQuery验证插件的validate（{成功}）选择似乎被错误地烧成后验证成功上每个单独的字段，而不是整个表格。即如果我输入一个数字的价格输入字段中的任何一个，这个成功选项，将火和我cancelPostback变量设置为false，这反过来又意味着，现在的形式，即使它没有经过验证，提交，只是因为一个领域是有效。我本来期望这种验证（{成功}）选择仅火一旦整个表格进行了验证。

我有没有解释这个错误，而事实上它做什么，它的意思是什么？ 如果是这样，我怎么能简单地我cancelPostback变量设置为true，只有当整个表单验证？

感谢堆对于任何见解或头向上。

我jQuery代码来实现验证和还拦截的.Net回发事件如下：

<script type="text/javascript">
    // By default, don't allow Postback until we've successfully validated our form on the client-side.
    var cancelPostback=true;

    // Every single time the page loads, including every single AJAX partial postback
    function pageLoad()
    {
        // Reset the value to say that "We don't allow Postbacks at this stage"..
        cancelPostback=true;

        // Attach client-side validation to the main form
        $("#<%= form1.ClientID %>").validate({ success: function() { alert('validation succeeded!'); cancelPostback = false; } });

        // Grab a reference to the Page Request Manager
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_initializeRequest(onEachRequest);

        alert("Page Load");
    }

    // Our own custom method to be attached to each new/future page request..
    function onEachRequest(sender, args)
    {
        alert("About to cancel? " + cancelPostback);
        // Check to see if we need to Cancel this Postback based on Conditional Logic within this page..
        args.set_cancel(cancelPostback);
    }
</script>
有帮助吗？

解决方案

我建议看submitHandler和invalidHandler选项。一方或另一方应该为你想要的工作。最好的办法，我认为，将是默认允许的回传和cancelPostback设置为true在invalidHandler。或者，您可以编写自己的submitHandler直接调用__doPostBack并通过ImageButton的替代提交。

其他提示

我有没有跟你解决问题，因为除了IE的所有浏览器都烧成了“onEachRequest”功能之前，jQuery的验证器的submitHandler（）函数。我想出了一个更好的解决方案，如果验证失败，而不是依赖于预先设定的变量，简单地取消回发。

  Sys.Application.add_init(function() {
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(onEachRequest);
  }); 

  function onEachRequest(sender, args) {
    if (args.get_postBackElement().id == <%= [YourSubmitButton].ClientID %>) {
      args.set_cancel(!$('#aspnetForm').valid());
    }
  }

感谢堆tvanfosson为提示帮助。

确定更新：

我也跟着越来越多的联系，最终找到了“成功”的文档。插件的自己的主页上的文档是可怕的，省略了许多关键功能:)但官方的jQuery页面上的“更好”。 “成功”选项的意思，每一次单个字段验证成功发射。因此，由设计工作，我被错误地假定当整个形式是有效的那只火。

我想你的想法invalidHandler。我喜欢这个想法。我碰到了一个问题是，ImageButton的的回传仍然ALWAYS火过第一，所以它会启动回发invalidHandler代码将运行之前。所以回传仍然会继续，那么在此之后，invalidHandler将禁用将来回传，他们在错误的顺序不幸射击。但除此之外，它显示具有完美的解决方案每隔符号。

余然后去的其他方式尝试submitHandler方式，即逆。同样，这个遭遇一些治安问题，因为回传会再次首先开火，但被阻止，那么submitHandler将使未来的回传，但为时已晚，所以这个回传被错过了。你不得不再次单击该按钮两次得到它去了。

所以最后半kludgey解决方案，这是不是太糟糕了，说实话，是：

我改变此行：             //附加客户端验证到主窗体             $（ “＃<％= form1.ClientID％>”）来验证（{submitHandler：函数（）{PreventPostback = FALSE; __doPostBack（ 'UpdatePanel1'， ''）;}}）;

正如你所看到的，第一次切换的PreventPostback变量，但随后手动触发掀起了新的回传，因为第一回发会已被阻止，离开了人世。所以本说明书__doPostBack调用确保新的回送被发射了尊重PreventPostback的新值。

我删除从ImageButtons后面的事件的方法，并提出了在所谓的“DoPostBackLogic（）”时，页回其仅称为服务器侧代码的新方法，该方法我知道一定是从该验证逻辑，因为这是可以的窗体上发生的唯一的回传。然后，所有的隐藏/显示/保存的逻辑在那里发生了我。这意味着，当我手动调用__doPostBack，我可以简单地使用在UpdatePanel的ID，而不必担心模仿特定的ImageButton等

此方式，它完美地工作。回发默认被禁用，并且当所述形式是有效的，回发然后允许的，但在回发然后手动触发，以便新的值生效。

所以这基本上是你的第二个解决方案，再次感谢聆听和分享！ ：）

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top