jQuery Validate plugin bedingtes Pflichtfeld

Ich habe ein Problem mit der jQuery validate plugin. Ich habe eine Reihe von 3 radio-buttons, wenn eine der ersten beiden ausgewählt, wird der Benutzer gezeigt, eine zusätzliche select-Eingabe auf dem Formular, wenn der Dritte ausgewählt ist, geschieht nichts.

Möchte ich Nutzer werden erforderlich wählen Sie etwas aus den zusätzlichen input auswählen, wenn Sie wählen Sie entweder option 1 oder 2 aus der radio-button gesetzt.

Ich geschrieben habe, der code für die erste option, aber es funktioniert nicht richtig. Wenn ich wählen Sie keine der Optionen, bekomme ich die beiden Fehler im Feld (eine für die radio-button festlegen, und die andere für die versteckten select-Eingang, das sollte nicht sein, die Validierung noch).

Wählen Sie die benutzerdefinierte code, der hat einige jQuery ermöglichen die Kontrolle darüber. Die jQuery setzt den ausgewählten Wert in das hidden input salaryband

Den code, den ich habe ist:

HTML

<!-- radio button select -->
<label>Earnings</label>
<div class="multiple-select earnings-wrapper clearfix">
    <div class="third">
        <input id="job-earnings-salary" class="trigger" data-type="salary"
        type="radio" name="jobearnings" value="salary" required="true">
        <label for="job-earnings-salary">Salary</label>
    </div>
    <div class="third">
        <input id="job-earnings-hourly" class="trigger" data-type="hourly"
        type="radio" name="jobearnings" value="hourly" required="true">
        <label for="job-earnings-hourly">Hourly</label>
    </div>
    <div class="third">
        <input id="job-earnings-unspecified" class="trigger" data-type="none"
        type="radio" name="jobearnings" value="unspecified" required="true">
        <label for="job-earnings-unspecified">Unspecified</label>
    </div>
    <input type="hidden" name="earningstype" id="earnings-type" class="trigger-input" value="">
</div>


<!-- First select box -->
<label for="salaryband">Salary Band</label>
<div class="select">
    <span class="select-default">Select Salary Band</span>
    <div class="options">
    <?php
        $args = array(
            'hide_empty' => false,
            'orderby' => 'ID',
        );
        $salaries = get_terms('salaries', $args);
        foreach( $salaries as $salary ) :
            echo '<span data-value="'.$salary->term_id.'">'.$salary->name.'</span>';
        endforeach;
    ?>
    </div>
    <input type="hidden" name="salaryband" id="salaryband" class="salary-band" />
</div>

Validation jQuery:

$("#client-form").validate({
    focusInvalid: false,
    ignore: [],
    rules: {
        salaryband: {
            required: {
                depends: function(element) {
                    return $("#job-earnings-salary:checked");
                }
            }
        }
    }
});

Irgendwelche Ideen, warum es immer die Validierung der input auswählen trotz der bedingten Regel erforderlich?

InformationsquelleAutor lukeseager | 2014-11-20
Schreibe einen Kommentar