Атрибут обязательной HTML-формы не работает на iOS iPad - PullRequest
0 голосов
/ 31 октября 2018

У меня есть HTML-форма с 2 текстовыми вводами и 2 выпадающими списками.

Я хочу, чтобы, если кто-то вводит текстовые вводы и нажимает ввод / возврат, форма не отправляется автоматически, а вместо этого перемещает курсор в следующее поле.

Было предложено использовать слово «обязательный» на моих input и select .. это имеет желаемый эффект на настольных компьютерах и планшетах Windows, однако на iPad оно не действует и вместо этого отправляет Форма, как только ввод / возврат нажаты.

Нужно ли что-то еще, чтобы это работало для iOS?

Примечание - обязательны только поля «Имя», «Посещение» и «Номер значка». «Компания» можно оставить пустым, однако мне все еще нужно, чтобы, если кто-то вводит это поле, форма не отправляется, если они нажимают клавишу ввода.

Я дал свой HTML и прокомментировал, где находятся поля - извинения, поскольку мои выпадающие списки выбора содержат PHP, который явно не будет отображаться в списке.

<form action="/visitor/visitor-book-sign-in" method="post" autocomplete="off">
    <div class="row" align="center">

        <div class="column left">
        
            <!-- MANDATORY FIELD - CANNOT BE LEFT BLANK -->
            <label for="name">Name<span class="err"></span></label><br>
            <input id="name" type="text" name="name" required=""><br>

            <!-- MANDATORY FIELD - CANNOT BE LEFT BLANK -->
            <label for="visiting">Visiting</label><br>
            <select id="visiting" name="Visiting" onchange="checkValue()" style="margin-bottom: 0;" required="">
                <option value="" selected="selected"></option>
                <option value="Site-Visit">Site Visit</option>
                <?php
                if($rows === true) {
                    while ($rows = sqlsrv_fetch_array($search, SQLSRV_FETCH_ASSOC)) {
                        ?>
                        <option value="<?php echo $rows['fullname']; ?>"><?php echo $rows['fullname']; ?></option>
                        <?php
                    }
                }
                ?>
                <option>Other (type name here)</option>
            </select>
            <input type="text" style="margin-bottom: 0; display: none;" id="other" onchange="checkOther()" name="Visiting-Other"/>

        </div>


        <div class="column right">

            <!-- CAN BE LEFT BLANK IF WISHED -->
            <label for="company">Company</label><br>
            <input id="company" type="text" name="company"><br>


            <!-- MANDATORY FIELD - CANNOT BE LEFT BLANK -->
            <label for="badge">Badge Number</label><br>
            <select id="badge" name="badge" required="">
                <option value=""></option>
                <?php
				foreach( $badges as $badge ) {
                    echo "<option value=" . $badge . ">" . $badge . "</option>";
                }
                ?>

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



    <div align="center">
        <a href="/visitor/visitor-book-home-page/<?php echo $location; ?>"><button class="back-btn2" type="button">Back</button></a>
        <input class="sign-in-btn2" type="submit" value="Sign In">
        <input type="hidden" name="submitted" value="TRUE">
		<input type="hidden" name="location" value="<?php echo $location; ?>">
    </div>


</form>
...