0

我有一些元素（输入、文本区域、控件组）和表单元素之外的提交按钮......

我可以验证这些元素（客户端）吗？例如，检查它们是否是必需的，如果它们为空则显示消息错误。我可以使用 jquery 验证插件来做到这一点吗？如何？

到目前为止，这是我的代码示例：

<div id="formContainer">

    <div data-role="fieldcontain">
        <fieldset data-role="controlgroup">
            <legend>User:</legend>
            <div id="usersContainer">
               <input type="radio" name="radio-choice-1" id="radio-choice-1" value="1" />
               <label for="radio-choice-1">User1</label>
               <input type="radio" name="radio-choice-1" id="radio-choice-2" value="2" />
               <label for="radio-choice-2">User2</label>
            </div>
        </fieldset>
    </div>

    <div data-role="fieldcontain" class="ui-hide-label">
        <label for="subjectMessage">Subject:</label>
        <input type="text" name="subjectMessage" id="subjectMessage" value="" placeholder="Subject" />
    </div>

    <div data-role="fieldcontain" class="ui-hide-label">
        <label for="bodyMessage">Body:</label>
        <textarea name="bodyMessage" id="bodyMessage" placeholder="Body" rows="8"></textarea>
    </div>

    <input id="sendMessageBtn" type="submit" value="Send" />
</div>

<script type="text/javascript">

    $(document).one("pageinit", function () {

        $("#sendMessageBtn").on("click", function () {

            var userId= $('#formContainer').find("#usersContainer :radio:checked").val();
            var subject = $('#formContainer').find("#subjectMessage").val();
            var body = $('#formContainer').find("#bodyMessage").val();

            //send data to the server...
        });

    });

</script>
4

1 回答 1

2

是的，有两种方法。

  1. 您不使用服务器端助手来生成标记并硬编码您的整个标记（如您的问题所示）。这非常糟糕，但如果您决定采用这种方法，则必须将相应的data-*属性添加到不显眼的验证框架正在使用的输入字段中。完全可以在 ASP.NET MVC 之外使用不显眼的验证框架，例如在 PHP 应用程序中，假设您的输入字段包含那些 data-* 属性。但正如我在之前的句子中所说：outside an ASp.NET MVC application这引出了一个问题：Why are you using ASP.NET MVC in this case if you do not take advantage of it?。所以我建议你刮掉这种方法，看看第二种可能性。

  2. 您使用服务器端助手来生成那些输入字段，例如 Html.EditorFor、Html.TextAreaFor、Html.DropDownListFor、... 这些助手将负责data-*在一个条件下生成适当的属性：这些元素在表单内。这不是您的情况，因此您可以通过在视图顶部添加以下行来欺骗他们，让他们认为他们在表单中：

    @{
    this.ViewContext.FormContext = new FormContext();
}
于 2013-05-14T16:09:42.467 回答