javascript вызов перед отправкой с использованием тимелеафа не работает должным образом - PullRequest
Новая
       2

javascript вызов перед отправкой с использованием тимелеафа не работает должным образом

0 голосов
/ 12 июля 2020

Я новичок в javascript, поэтому для многих это может быть простой вопрос.

Я использовал форму sumbit в тимелеафе и пытаюсь добавить проверку JS перед тем, как форма будет отправлена ​​в пружина mvc контроллер. Я могу выполнять эти два действия по отдельности (индивидуальные задачи). Однако я не мог заставить их работать один за другим (функция js и отправка формы). Действие отправки запускается кнопкой внутри формы. 

<form th:action="@{/user/trigger}" th:object="${triggers}" method="post">
                            
 <input type="hidden" name="tradeDate"  th:value="${trigger.id.tradeDate}">
<button type="submit" id="ignore" name="action" value="ignoreOrder" class="btn btn-primary btn-sm">Ignore</button>
                            </form>

Функция js выглядит следующим образом: 

$(".ignore").click(function() {
//do some processing;
                return false;
            });

Так может кто-нибудь может помочь мне переписать этот код, который будет сначала вызовите функцию JS и отправьте форму в контроллер java spring mvc? Заранее спасибо.

1 Ответ

0 голосов
/ 12 июля 2020

Проблема с вашим подходом заключается в том, что после того, как ваш java -скрипт проверяет код, ваша кнопка html 'submit' отправляет форму, поскольку они выполняются одна за другой. Вы ничего не сделали, чтобы предотвратить отправку формы после неудачной проверки. Чтобы решить эту проблему, вы можете отправить форму с помощью кода JavaScript вручную только после успешной проверки. Таким образом, ваш код будет выглядеть примерно так -

1.) Изменения в коде Html, вместо того, чтобы создавать тип кнопки как «отправить», сделайте его обычной кнопкой и запустите функцию проверки javascript при его щелчке - 

    <form th:action="@{/user/trigger}" th:object="${triggers}" id="myForm" method="post">
                                
        <input type="hidden" name="tradeDate"  th:value="${trigger.id.tradeDate}">
        <button type="button" id="ignore" name="action" onclick="myValidationFunction()" value="ignoreOrder" class="btn btn-primary btn-sm">Ignore</button>
      
 </form>

2.) Изменения в коде Javascript, теперь после нажатия на вышеуказанную кнопку ваша функция проверки javascript будет выполняться, и после успешной проверки отправьте форму вручную, используя идентификатор формы, примерно так - 

    function myValidationFunction(){
    
      if( some_condition ){
        //validation failed
        return; 
      }
    

     //validation success , when above mentioned if condition is false.
     $("#myForm").submit(); // Submit the form
    
    
    }

Для получения дополнительных сведений об использовании submit в jquery обратитесь к официальной документации -

https://api.jquery.com/submit/

...