6

私は、amazingSurge のjquery-wizard プラグインを formvalidation.ioプラグインと一緒に使用しています。私の意図は、ユーザーがウィザードを進めたいときにフォームの検証を行うことです。これは、通常の入力の検証とチェックボックスの検証に最適です。ただし、ラジオ入力フォームの検証に問題があります。このフォームでは、最初のラジオ ボタンを選択したときにのみ、前に進むことができます。フォームに 20 個のラジオ ボタンがあり、3 番目のラジオ ボタンを選択すると、フォームの検証で何も選択されていないと表示されます。

ここに私の検証コードがあります:

$('#employeeForm').formValidation({
    framework: 'bootstrap',
    fields: {
        employeeInput: {
            validators: {
                notEmpty: {
                    message: 'Please choose an employee'
                }
            }
        }
    }
});

wizard = $("#exampleWizardForm").wizard(options).data("wizard");

wizard.get("#employees").setValidator(function() {
    var fv = $("#employeeForm").data("formValidation");
    return fv.validate(), fv.isValid() ? !0 : !1
});

// add validation after form was dynamically created
$('#employeeForm').formValidation('addField', $("#employeeInput"));

ここに私のフォームがあります：

<form id="employeeForm" novalidate="novalidate" class="fv-form fv-form-bootstrap">
<div class="table-responsive">
    <table class="table table-hover text-right">
        <tbody id="employee_items">
            <tr>
                <td class="text-center">
                    <label><input type="radio" value="196" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label>
                </td>
                <td class="text-left">Employee 1</td>
                <td>Software Tester</td>
            </tr>
            <tr>
                <td class="text-center">
                    <label><input type="radio" value="200" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label>
                </td>
                <td class="text-left">Employee 2</td>
                <td>Software Engineer</td>
            </tr>
            <tr>
                <td class="text-center">
                    <label><input type="radio" value="201" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label>
                </td>
                <td class="text-left">Employee 3</td>
                <td>CEO</td>
            </tr>
        </tbody>
    </table>
</div>

何か不足していますか？無線入力のフォーム検証が期待どおりに機能しないのはなぜですか?

ここに画像の説明を入力

4

2 に答える 2

2

要素の id 属性は、ページ全体で一意である必要があります。代わりに、3 つのラジオ ボタンの名前は同じにする必要がありますが、ID は異なります。

于 2016-04-25T15:17:38.590 に答える