Как в форме React-bootstrap preventDefault? или избавиться от полной перезагрузки страницы при submit?

Question

[Ninja Mate]

Нужна валидация формы, но не нужна полная перезагрузка страницы. Как от нее избавиться?
e.preventDefault в функции реакта не работает. Можно убрать форму и просто посылать поля кнопкой, но тогда пропадает валидация, а она нужна.

<form>//если ставим сюда onSubmit, валидация происходит, но страница перегружается
     <ButtonInput type="submit" onClick={()=>this.handleSubmit()} /> 
     //Если из кнопки убираем type="submit" валидация формы не идет
</form>

handleSubmit() в функции jQuery с ajax

Comments

[Dmitriy Uvarov]

Можно взглянуть, где у вас используется preventDefault и при это не работает?

[Ninja Mate]

Дмитрий Уваров: Вот так пробовал, были и другие варианты, но этот мне кажется должен работать, хотя я и нашел массу подобных ответов на свою проблему, но разобраться не получается

handleSubmit(e) {
    e.preventDefault();
    jQuery.post(
        MyAjax.ajaxurl,
        {
...
<form onSubmit={()=>this.handleSubmit()} >
</form>
<ButtonInput type="submit"...

[Aves]

Ninja Mate: ну так this.handleSubmit(e) же надо

[Ninja Mate]

Aves: это я опечатался, все равно выдает ошибку Uncaught ReferenceError: e is not defined

[Aves]

Ninja Mate: (e)=>this.handleSubmit(e) ?

[Ninja Mate]

Aves: Да. Спасибо. не то событие передавали. напишите как ответ, отмечу. Спасибо.

Answer 1

[Aves]

Нужно передавать событие из arrow function expression в метод handleSubmit

<ButtonInput type='submit' onClick={ e => this.handleSubmit(e) } />