jQuery表单验证不起作用

Question

I have this JQuery Mobile Form, which sends the inputs to a MySQL Database. I would like to validate all fields as required. However, it does not work and I cannot find the error.

Here is the first part of the form. I put "required" on the input fields.

<form id="form-haftpflicht" method="post">
<div data-role="fieldcontain">
    <fieldset data-role="fieldcontain">
        <label for="versicherungsbeginn"><b>Versicherungsbeginn</b></label>
        <input type="date" name="versicherungsbeginn" id="versicherungsbeginn" value="" required />
    </fieldset>
    <fieldset data-role="fieldcontain">
        <label for="erwachsene" class="select"><b>Anzahl Erwachsene:</b></label>
        <select name="erwachsene" id="erwachsene" data-role="none" required>
            <option value="standard" data-placeholder="true">-- Bitte wählen --</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>

        </select>
    </fieldset>
    <fieldset data-role="fieldcontain">
        <label for="kinder" class="select"><b>Anzahl Kinder:</b></label>
        <select name="kinder" id="kinder" data-role="none" required>
            <option value="standard" data-placeholder="true">-- Bitte wählen --</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>

        </select>
    </fieldset>
</div>

And here is my script with the API

 $(document).ready(function () {

        $("#store-haftpflicht").click(function () {
            $("#form-haftpflicht").submit();
        });
        $("#form-haftpflicht").submit(function (event) {
            event.preventDefault();
            $("#ajax-loader").css("display", "block");
            $.ajax({
                url: 'http://app.lovanet.ch/app/store_haftpflicht.php',
                data: $(this).serialize(),
                method: 'POST',
                success: function (data, status) {
                    $("#ajax-loader").css("display", "none");
                },
                error: function () {
                    output.text('Keine Prämien gefunden.');
                }
            });
        });
    });

Answer 1

A select is considered empty (and then invalid if the field is required) if the selected option has an empty value (""), but yours have a value ("standard").

To fix the problem with validation, just replace the "standard" value in the first option for a "":

<select name="kinder" id="kinder" data-role="none" required>
    <option value="" data-placeholder="true">-- Bitte wählen --</option>
    <option value="1">1</option>
    <option value="2">2</option>