form.submit() и проверка HTML5
По причинам дизайна я не могу использовать
<input type="submit" />
отправить форму. Вместо этого код выглядит следующим образом:
<a onclick="form.submit()"></a>
Форма содержит элементы с
required="required"
приписывать. К сожалению, проверка HTML5 не работает таким образом. Это работает должным образом с обычной кнопкой отправки все же.
Есть идеи, почему? Есть ли способы запустить проверку HTML5 без использования кнопки отправки?
Отредактировано согласно вашему запросу:
<form name="form" method="post" action="https://pilot.datatrans.biz/upp/jsp/getCcAliasFormMod.jsp" id="form_payment_cc" name="uppform">
<label for"cvv">CVV</label><br />
<input type="text" size="4" id="cvv" name="cvv" value="" required="required" />
<p></p>
<div class="order">
<div></div> <div><a href="#" onclick="javascript:$( '#form_payment_cc' ).submit();"><img src="/images/pfeil_orange.png" style="margin-left: 30px;"><strong>Weiter</strong></a></div>
</div>
<input type="hidden" id="form__token" name="form[_token]" value="LaBK9OAZyhjENzWmCiCokS0kGXgFmbPNm7v1lo1LuRs" />
</form>
2 ответа
Ты можешь попробовать <a onclick="if(form.checkValidity()) form.submit()"></a>
Хотя может быть лучше использовать CSS, чтобы применить свой собственный дизайн и использовать нативные кнопки.
Обновление:
Кажется, для запуска собственной проверки требуется обычная кнопка. Таким образом, возможное решение было бы использовать скрытую кнопку и вызвать клик с помощью JS:
<form>
<input name="email" type="email" title="Enter your email" required />
<input id="sumbitBtn" type="submit" style="position: absolute; left: -9999px" />
<a href="#" onclick="document.getElementById('sumbitBtn').click();">Submit</a>
</form>
Для решения на основе CSS (не требуется JS), используя обычную кнопку, проверьте эту скрипку
Если вы хотите отобразить собственные сообщения об ошибках, которые есть в некоторых браузерах (например, Chrome), к сожалению, единственный способ сделать это - отправить форму, например:
<form id="myform" action="" method="POST">
<a href="#" id="mylink"> submit </a>
</form>
а потом:
window.onload = function() {
document.getElementById('mylink').onclick = function() {
document.getElementById('myform').submit();
return false;
};
};