Webshims: проверить форму при отправке, нажав на ссылку - PullRequest
Новая
       37

Webshims: проверить форму при отправке, нажав на ссылку

2 голосов
/ 12 марта 2012

Я использую библиотеку Webshims для заполнения проверки формы HTML5. Проблема в том, что для того, чтобы проверка прошла, я должен использовать кнопку ввода ввода. Это то, чего я хотел бы избежать, так как у меня есть "linkbutton" в стиле css для сохранения формы: 

<a href="#" id="myLink" class="submit">
    <em>&nbsp;</em><span>Save form</span>
</a>

При нажатии на кнопку ссылки форма отправляется нормально, но проверка никогда не происходит. Я использую jQuery для отправки формы при нажатии на ссылку: 

$('myLink').click(function(e) {
    $('myForm').submit();
});

Можно ли каким-то образом принудительно выполнить проверку так же, как при отправке формы с помощью кнопки ввода ввода?

1 Ответ

2 голосов
/ 14 марта 2012

Webshims реализует API проверки формы, как указано в HTML5.Вы можете прочитать следующий отчет об ошибке и мой ответ на него: https://github.com/aFarkas/webshim/issues/103#issuecomment-4298458

Вот краткий «обходной путь» для вашей проблемы: 

//configure webshims to use customized bubbles
$.webshims.setOptions('forms', {
    replaceValidationUI: true
});

//start polyfilling forms feature
$.webshims.polyfill('forms');


$(function(){
    $('myLink').click(function(e) {
        if($('myForm').checkValidity()){
            $('myForm').submit();
        }
    });
});

Но чтобы это было понятно, лучший способэто использовать кнопки отправки.Чтобы получить кнопки отправки в стиле, вот простой сброс кнопок, который должен работать в x-browser: 

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
input.btn-reset,
button.btn-reset {
    overflow: visible;
    display: inline-block;
    border: none;
    padding: 0;
    background: transparent;
    -webkit-appearance: none;
    color: #000;
    font-family: arial,helvetica,sans-serif;
    cursor: pointer;
}
...