如何避免在MVC的Web应用程序的模型和视图约束验证重复的代码？(How to avoid dupl

完整性约束应该以MVC应用的模型类定义，因为它们是一个模型类的语义（表示业务对象类型）的一部分。然而，限制也对在该应用的基于HTML5的形式的视图代码的用户输入（并在表单提交按钮点击）来进行验证。我们如何才能避免重复验证代码 ，并保存在一个JavaScript MVC应用程序的模型代码？

不幸的是，很多MVC应用程序开发框架，不用于保持模型的完整性约束代码提供任何支持，并利用它进行资料验证这两个视图（输入和提交表格），并在模型（前保存）。

我会尽量提供我所开发的解决与HTML5的形式API此多个验证问题的办法，它的草图setCustomValidity和checkValidity方法。因为它要求无论是在视图和模型执行相同的代码，它只能在一个JavaScript MVC的Web应用程序，我们必须在应用程序的两个部分相同的编程语言（JavaScript的），不像其他（如PHP OD的Java）Web应用程序，其中后端模型代码是不是在JavaScript中。

通常情况下，我们必须验证仅性质约束。这是自然的，因此，要编写验证所有约束的模型类的每个属性的类级检查功能。例如，下面的检查功能可以确保一个的ISBN属性的值Book对象是一个10位数字的字符串或9位数字的字符串后面加上“X”：

Book.checkIsbn = function (isbn) {
  if (typeof(isbn) !== "string" || isbn.trim() === "") {
    return new RangeConstraintViolation("The ISBN must be a non-empty string!");
  } else if (!/\b\d{9}(\d|X)\b/.test( isbn)) {
    return new PatternConstraintViolation(
        'The ISBN must be a 10-digit string or a 9-digit string followed by "X"!');
  } else {
    return new NoConstraintViolation();
  }
};

校验函数返回的一个实例ConstraintViolation类，它有一个字符串值的消息属性。在HTML5的形式提供的视图（或UI），我们添加的事件侦听器input事件表单输入字段关注用于处理用户输入验证：

isbnInpEl.addEventListener("input", function () { 
  isbnInpEl.setCustomValidity( Book.checkIsbn( isbnInpEl.value).message);
});

此事件侦听器调用setCustomValidity方法，其中有一个字符串参数。我们提供我们的财产检查功能作为的调用参数创建的消息setCustomValidity 。如果它是空的，这意味着用户输入有效。否则，如果它包含一个非空的约束违反消息，所述浏览器HTML5将指示所述约束违反给用户（例如，通过示出了用于输入字段红色边框和显示消息）的护理。

为了处理表单提交按钮，点击确认，我们通过调用HTML5检查形式的所有输入字段checkValidity的表单元素的方法：

if (formEl.checkValidity()) {
  // save
  formEl.reset();
}

最后，保存任何新数据之前检查模型类的限制，我们可以调用检查功能，在属性设置器，如

Book.prototype.setIsbn = function (isbn) {
  var validationResult = Book.checkIsbn( isbn);
  if (validationResult instanceof NoConstraintViolation) {
    this.isbn = isbn;
  } else {
    throw validationResult;
  }
};

你可以在我的书中完整的示例代码构建前端Web应用程序与普通的JavaScript 。