Javascript 集成远程验证与HTML5验证

我有一个使用HTML5验证的表单，我想在其中加入一些远程验证。以下是在我的页面上生成的相关HTML和Javascript：

<form action="/en-GB/Main/UserAdd" method="post">    <fieldset>
        <legend>Fields</legend>
        <div class="editor-label">
            <label for="Username">Username</label>
        </div>
        <div>
            <input data-val="true" data-val-remote="&#39;Username&#39; is invalid." data-val-remote-additionalfields="*.Username" data-val-remote-url="/en-GB/Validation/IsUsernameAvailable" data-val-required="The Username field is required." id="Username" name="Username" required="true" type="text" value="" />
        </div>
        <div class="editor-label">
            <label for="FirstName">FirstName</label>
        </div>
        <div class="editor-field">
            <input data-val="true" data-val-required="The FirstName field is required." id="FirstName" name="FirstName" required="true" type="text" value="" />
        </div>
        <div class="editor-label">
            <label for="Surname">Surname</label>
        </div>
        <div class="editor-field">
            <input data-val="true" data-val-required="The Surname field is required." id="Surname" name="Surname" required="true" type="text" value="" />
        </div>
        <div>
            <label for="Country">Country</label>
        </div>
        <div>
            <select data-val="true" data-val-number="The field CountryId must be a number." data-val-required="The CountryId field is required." id="CountryId" name="CountryId"><option value="1">United Kingdom</option>
<option value="2">Republic of Ireland</option>
<option value="3">Australia</option>
<option value="4">New Zealand</option>
<option value="5">United States</option>
</select>
        </div>
        <p>
            <input type="submit" value="Add User" style="font-size:11px;font-family:Verdana;font-weight:bold;" />
        </p>
    </fieldset>
    <script type="text/javascript">
        $(document).ready(function () {

            //set up buttons
            $(function () {
                $("input:submit").button();
            });

            var elementsInput = document.getElementsByTagName("input");

            for (var i = 0; i < elementsInput.length; i++) {

                elementsInput[i].oninvalid = function (e) {

                    if (!e.target.validity.valid) {

                        switch (e.target.name) {

                            case "Username":
                                e.target.setCustomValidity("Please enter a Username");
                                break;

                            case "FirstName":
                                e.target.setCustomValidity("Please enter a First Name");
                                break;

                            case "Surname":
                                e.target.setCustomValidity("Please enter a Surname");
                                    break;
                    }
                }
                    };
            elementsInput[i].oninput = function (e) {
                e.target.setCustomValidity("");
            };
        }


        });

        </script>

领域
用户名
名字
姓
国家
大不列颠联合王国
爱尔兰共和国
澳大利亚
新西兰
美国


$（文档）.ready（函数（）{
//设置按钮
$（函数（）{
$（“输入：提交”）.button（）；
});
var elementsInput=document.getElementsByTagName（“输入”）；
for（变量i=0；i

是否可以将data val remote属性合并到我的javascript中，以便在我的HTML5验证中显示来自该属性的验证消息

编辑：这是我的远程验证类：

public class ValidationController : Controller
{
    IMainRepository _repository;

    public ValidationController() : this(new MainRepository())
    {
    }

    public ValidationController(IMainRepository repository)
    {
        _repository = repository;
    }

    public static string GetAltName(string Username, IMainRepository repository)
    {

        string suggestedUID = String.Format(CultureInfo.InvariantCulture,
            "{0} is not available.", Username);

        for (int i = 1; i < 100; i++)
        {
            string altCandidate = Username + i.ToString();
            if (!repository.UsernameExists(altCandidate))
            {
                suggestedUID = String.Format(CultureInfo.InvariantCulture,
               "{0} is not available. Try {1}.", Username, altCandidate);
                break;
            }
        }

        return suggestedUID;
    }

    public JsonResult IsUsernameAvailable(string Username)
    {

        if (!_repository.UsernameExists(Username))
            return Json(true, JsonRequestBehavior.AllowGet);

        string suggestedUID = GetAltName(Username, _repository);
        return Json(suggestedUID, JsonRequestBehavior.AllowGet);
    }
}

公共类验证控制器：控制器
{
IMAIN存储库；
public ValidationController（）：此（新的MainRepository（））
{
}
公共验证控制器（IMainRepository存储库）
{
_存储库=存储库；
}
公共静态字符串GetAltName（字符串用户名，IMainRepository存储库）
{
string suggestedUID=string.Format（CultureInfo.InvariantCulture，
“{0}不可用。”，用户名）；
对于（int i=1；i<100；i++）
{
字符串altCandidate=Username+i.ToString（）；
如果（！repository.username存在（altCandidate））
{
suggestedUID=String.Format（CultureInfo.InvariantCulture，
“{0}不可用。请尝试使用{1}。”，用户名，可选）；
打破
}
}
返回建议ID；
}
public JsonResult IsUsernameAvailable（字符串用户名）
{
如果（！\u repository.UsernameExists（Username））
返回Json（true，JsonRequestBehavior.AllowGet）；
string suggestedUID=GetAltName（用户名，_存储库）；
返回Json（suggestedUID，JsonRequestBehavior.AllowGet）；
}
}

当然，我不明白为什么不能推出一些基于属性返回输入有效性的服务。你是要我们为你写这篇文章吗？我才刚刚开始使用HTML5，希望能得到一些提示。我已经编写了创建data val remote属性的方法，但是现在我需要了解如何在javascript中检查它？你能用这个更新你的问题吗？如果你想得到答案，我建议你将问题分解到最低级别。使用带有一个示例输入的表单，您当前使用的验证javascript/jquery，以及您希望它执行的操作。我们很难读懂一大块html，我删除了除了生成的表单和javascript之外的所有内容，以使其更具可读性