Предотвратить отправку формы, когда я помещаю любое ключевое слово поиска в текстовое поле ввода, а затем нажимаю клавишу ввода. Использование Jquery

Привет, у меня есть этот код на laravel blade,

<h1 class="" id="module-users-h1">Search User</h1>

<form class="" id="module-user-search" action="" method="post">
    <div class="field has-addons">
        <div class="control is-expanded">
            <input class="input" type="text" name="user" id="module-user-search-input" placeholder="Find user">
        </div>
        <div class="control">
            <button type="button" class="button is-info" id="module-user-button" name="button">Seach</button>
        </div>
    </div>
</form>

для функции поиска.

и у меня есть этот код javascript,

/**
 * Perform search user -------------------
 *
 * @return void
 */
$('#module-user-button').click(function(e) {
    let formData = $(this).parents('form').serialize();

    axios.get('/modules/getuser/' + formData.split('=')[1])
    .then((response) => {
        console.log(response.data);
    });
});

$('#module-user-search-input').keyup(function (e) {
    e.preventDefault();

    if (e.keyCode === 13) {
        $('#module-user-button').click();
    }
});

Что я пытаюсь сделать, кроме нажатия кнопки, я хотел бы выполнить поиск при нажатии клавиши ввода.

Проблема в том, что когда я помещал любое имя пользователя в качестве ключевого слова для поиска в текстовое поле ввода, затем нажимал ввод. Форма будет отправлена ​​​​в результате такой ошибки в laravel.

Любые идеи или решения для этого?

введите здесь описание изображения


person Fil    schedule 20.10.2018    source источник
comment
Этот ответ должен великолепно решить вашу проблему: stackoverflow.com/questions/895171/   -  person Hektor    schedule 20.10.2018


Ответы (1)


Вы можете отключить поведение по умолчанию, вернув false при нажатии клавиши ввода в форме следующим образом:

$(document).on("keypress", "#module-user-search", function(event) 
{ 
    if (event.keyCode == 13)
        return false;
});
person manuman94    schedule 20.10.2018