带有淘汰赛和引导程序的 JQuery 验证引擎答案

【问题标题】：JQuery Validation Engine with knockout and bootstrap带有淘汰赛和引导程序的 JQuery 验证引擎
【发布时间】：2013-08-26 05:34:23
【问题描述】：

我在我的项目中使用引导程序和淘汰赛。之前我使用的是淘汰赛验证，但现在我必须使用带有淘汰赛视图模型和引导 html 的 jquery 验证引擎。假设这是我的 html

<fieldset>
    <div class="form-group">
        <label for="name">Name</label>
        <input type="text" class="form-control placeholder" id="personName" placeholder="Your name" data-bind="value: name" />
    </div>
    <div class="form-group">
        <label for="email">Email address</label>
        <input type="email" class="form-control placeholder" id="personEmail" placeholder="Your email" data-original-title="Your activation email will be sent to this address." data-bind="value: email, event: { change: checkDuplicateEmail }" />
    </div>
    <div class="form-group">
        <label for="password">Password</label>
        <input type="password" class="form-control placeholder" id="password" placeholder="Password" data-bind="value: password" />
    </div>
    <div class="form-group">
        <label for="confirmPassword">Repeat Password</label>
        <input type="password" class="form-control placeholder" id="repeatPassword" placeholder="Repeat password" data-bind="value: confirmPassword, event: { change: matchPassword }" />
    </div>
    <div class="form-group">
        <label for="companyName">Company Name</label>
        <input type="text" class="form-control placeholder" id="companyName" placeholder="Your company name" data-bind="value: company" />
    </div>
    <div class="form-group">
        <label for="country">Country</label>
        <select class="form-control placeholder" id="country" data-bind="options: availableCountries, value: selectedCountry, optionsCaption: 'Country'"></select>
    </div>
    <button id="signupuser" type="button" data-bind="click: signup" class="btn btn-primary btn-block">Create Free Account</button>
</fieldset>

现在我对如何在上面的代码中使用jQuery Validation Engine Plugin 感到困惑。

【问题讨论】：

您对哪个部分感到困惑？你试过什么了？你的视图模型是什么样子的？你想验证什么？
我很困惑如何使用这个插件，因为我的标记中没有form 元素。
那你为什么不把你的fieldset包装成form呢？
是的，我知道如果我将字段集包装到表单中，这可能会起作用，但是没有表单还有其他方法吗？

标签： jquery twitter-bootstrap knockout.js jquery-validation-engine

【解决方案1】：

终于在demos得到解决方案，将fieldset包装成一个div

<div id="formID">
<fieldset>
// all input elements here 
</fieldset>
</div>

在 JS

  $(document).ready(function () {
        $("#formID").validationEngine();
        $(".submit").click(function () {
            $("#formID").validationEngine('validate');
        })
    });

【讨论】：

【解决方案2】：

首先，我强烈建议您阅读documentation，以便您更好地了解如何实施验证。

那是 Working Demo 来验证您的表单。

例如，要使您的输入成为必需，您需要使用的就是

<input type="text" id="name" class="validate[required]" />

要使您输入的电子邮件有效：

<input type="text" id="email" class="validate[required,custom[email]]" />

【讨论】：