Почему не работает e.preventDefault() в Yii2?

Question

[Артем Прохоров]

Форма в представлении:

<?php $form = ActiveForm::begin(['id' => 'test_form']) ?>
    <?= $form->field($menu, 'name') ?>
    <?= $form->field($menu, 'age') ?>
    <?= Html::submitButton('Click me...', ['id' => 'btn']) ?>
    <?php ActiveForm::end() ?>

Js:

let form = document.querySelector('#test_form');
const csrfToken = document.querySelector("[name='csrf-token']").content

form.addEventListener('submit', function(e) {
    e.preventDefault();

    let promise = fetch('/?r=post/show', {
        method: 'POST',
        body: new FormData(this),
        headers: {
            "X-CSRF-Token": csrfToken //  Set the token
        }
    });
    
    promise
        .then(
            data   => {return data.json()}
        )
        .then(
            result => {console.log(result)}
        )
});

Консоль ошибок не выдает не до перезагрузки ни после. Сам результат возвращает верно.

Update:

prevent работает на сылки, почему то такое поведение только у submitButton/submitInput на формах.

Update 2.0:

В общем я интегрировал vue,js и с ним prevent работает, причем код не поменял вовсе (ну разве что саму функцию я засунул в new Vue({});. Причины такого поведения мне до сих пор не ясны.

Comments

[Дмитрий]

form.addEventListener('submit', function(e) {
    e.preventDefault();
    .........
});

[Артем Прохоров]

Дмитрий, Пробовал сам уже, не помогло.

Answer 1

[Радость моя]

Если вам нужно предотвратить отправку формы - тоe.preventDefault(); нужно писать вначале слушателя а не в конце.

Comments

[Артем Прохоров]

Уже сам пробовал, не помогает.