Question

我在我的项目中使用bootstrap和knockout。在此之前我正在使用淘汰赛验证，但现在我必须使用jquery验证引擎与淘汰视图模型和bootstrap html。假设这是我的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感到困惑。

Answer 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');
        })
    });

Answer 2

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

Working Demo 验证您的表单。

例如，要求您输入所需的所有内容

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

要输入有效的电子邮件：

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

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

2 个答案: