jQuery - отправить по возвращении для одной формы, отключив отправку по возвращению для другой формы

У меня есть страница с более чем одной формой. Одна форма (см. Пример ниже) имеет вход для добавления строк в таблицу на странице. Каждая из строк в таблице может быть включена (галочка) вкл / выкл. Другая форма представляет страницу, отправляющую, какие строки были "включены" на следующую страницу.

Итак, первоначальная проблема заключалась в том, что люди вводили URL и нажимали кнопку возврата, чтобы добавить его в таблицу, но вместо этого не добавляли его, а отправляли "другую" форму (mainForm).

Итак, я добавил jQuery ниже. Это решило проблему - теперь, когда поле URL находится в фокусе и вы нажимаете кнопку возврата, оно добавляет URL в список и не передает mainForm.

Однако, когда это поле НЕ находится в фокусе, нажатие возврата ничего не делает - когда я ожидал, что оно отправит форму (поведение по умолчанию) ... так как событие присоединено только к этому одному полю ввода.

HTML (очень упрощенный):

<form name="data>
 <input id="url" class="field" type="text" size="65" name="urlText">
 <input class="hubField" type="button" value="Add Url" name="urlAddButton">
 <table>
    <tr>
       <td><input type="checkbox"></td>
       <td>Description text</td>
       ....and so on...
 </table>
</form>

<form name="mainForm">
 <input type="SUBMIT" value="Load Selected Urls" name="Submit">
</form>

JS / JQuery:

$(document).ready(function() {
    $('#url').bind('keyup',function(e) {
        if (e.which == 13) {
        $('input[name="urlAddButton"]').focus().click();
        e.preventDefault();
        }
    })
});

Я довольно новичок в jQuery, так что будьте добры.;-) В js я, вероятно, просто напишу что-нибудь, сказав, что если это поле не в фокусе и нажата кнопка возврата, отправьте основную форму. Есть ли хитрость, чтобы сделать это проще в JQuery?

2 ответа

Решение

Если я понимаю, вы хотите отправить mainForm, когда пользователь нажимает ввод, когда он не введен в URL. Когда он входит, вы нажимаете кнопку "urlAddButton". Если это так, вот рабочий пример на jsFiddle: http://jsfiddle.net/MUUUE/

$(document).ready(function(){
    $(this).bind('keydown',function(e) {//keyDOWN (for the input)
        if(e.which == 13) {//if enter is pressed
            if(e.target.id == "url"){//and we're in the url input
                 $('input[name="urlAddButton"]').focus().click();
                 e.preventDefault();
            }
            else if(e.target.type != "textarea" && e.target.type != "text"){//else, we submit the main form (if we're not in another input or textarea)
                $("#mainForm").submit();//id attr added in the html code
            }
        }
    })
});

Но, в конце концов, я не уверен, что так хорошо отправлять форму, пока вы не участвуете.

Дайте форму, которую вы хотите отправить идентификатор ("mainform"), а затем использовать $('#mainform').submit(); Я понимаю, что вы можете настроить таргетинг на эту форму на основе атрибута name, но использовать идентификатор намного быстрее, если у вас есть контроль над разметкой.

Проверьте документы для больше. - http://api.jquery.com/submit/ и образец, который они дают

$(document).ready(function() {
    $('#url').bind('keyup',function(e) {
        if (e.which == 13) {
            $('#mainform').submit();
            e.preventDefault();
        }
    })
});
Другие вопросы по тегам