У меня есть 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>