MVC - 在按钮点击时触发服务器端页面验证，使用 AJAX 调用

Question

我正在开发的一个应用程序中，有一个需求：在点击某个按钮时，对一些相关的文本框进行验证；如果它们没有通过验证，则不会发生任何事情，否则将从一个 AJAX 调用触发一个操作。这个 AJAX 调用返回一些关于操作成功的消息。

这个部分视图看起来有点像这样：

<div>
  <div id='cell-phone'>
    @Model.ValidationMessageFor(x=>x.Model.CellNumber)
    @Model.TextBoxFor(x=>x.Model.CellNumber)
  </div>
  <div id='pager'>
    <!-- Ditto, only x.Model.Pager; yes, some people use pagers still. -->
  </div>
  <div id='page-address'>
    <!-- ... x.Model.PageAddress ... -->
  </div>
  <div id='pager-test'>
    <a href='#' id='test-pager' class='button'>Test</a>
    <span id='test-result'></span>
  </div>
</div>

<script>
var $cellNum = $('#cell-phone input'),
    $pagerNum = $('#pager input'),
    $pageAddress = $('#page-address input'),
    $testPager = $('#pager-test'),
    $testResult = $('#test-result');

$(document).ready(function () {
  $testPager.click(function () {
    pagerTest();
  });
});

function pagerTest() {
  var args = { address: $pageAddress.val() };
  $.getJSON('@Url.Action("SendTestPage")', args, function(result) {
    $testResult.html(result.Message);
  });
}
</script>

......在服务器级别下......

public JsonResult SendTestPage(string address)
{
   // SNIP: Other unnecessary details.
   var result = new EmailSendResult
                {
                  success = SendEmailMethod(address)
                };
   result.message = result.success
                    ? "Message sent!"
                    : "Couldn't send message...";

   return result;       
}

....

public class EmailSendResult
{
  public bool success;
  public string message;
}

问题：虽然我能够获取消息/成功值，但我还需要触发视图模型的验证。我不知道如何使用AJAX调用来做到这一点。我的怀疑是要么A）我用错了工具，要么B）我用对了一个工具，但我需要其他东西。我缺少什么才能让验证生效？

- Andrew Gray

Answer 1

当你点击“test-pager”链接时，会调用该操作，但是你的表单验证不会触发，因为你的链接不是提交按钮。如果你想让验证生效，必须在表单上放置一个提交按钮。当用户点击它时，验证将触发。所以将“test-pager”更改为以下内容：

<input type="submit" id="test-pager" class="button" />

- Bahman

---

成功了！结果证明，我更好的建议是将一些电子邮件发送逻辑从控制器移动到视图模型对象，并使控制器使用不同的操作来知道要调用什么（以及我的单元测试也是如此）。 最终结论：我有一半的工具是正确的。您先生提供了另一半。 - Andrew Gray

Answer 2

或者（如果我理解问题正确），您可以绑定地址文本框更改事件，并在其中调用testPage函数。

- Shridhar