CODEWITHSUNDEEP
javascriptjquery
user10123295
user10123295

Reputation:

Display thankyou message after submit

My problem is when i click submit button with empty textfields the validation appear and when i fill in all the textbox and submit the modal just flashes. I think their's somethig wrong at my script.

here is my validation script:

<script>
(function() {
  'use strict';
  window.addEventListener('load', function() {
    var forms = document.getElementsByClassName('needs-validation');
    var validation = Array.prototype.filter.call(forms, function(form) {
    form.addEventListener('submit', function(event) { 
          if (form.checkValidity() === false) {
            event.preventDefault();
            event.stopPropagation();
          }
          form.classList.add('was-validated');

      }, false);
    });
  }, false);
})();
  </script>

And here is for my modal message:

  <script>
      $(document).ready(function(){
        $("#submit").click(function(){
          if($('#username').val().trim().length > 0 && $('#id').val().trim().length > 0) {
             $("#modalSuccess").modal();
          } 
        });
      });
    </script>

Hope you can help me fix it. advanced thanks

Upvotes: 1

Views: 92

Answers (2)

thamizhinian
thamizhinian

Reputation: 83

you can try this

if (form.checkValidity() === false) {
   event.preventDefault();
   event.stopPropagation();
   this.classList.add('was-validated');
}
else if (form.checkValidity() === true) {
   you success script
}

Upvotes: 1

Vinh Can Code
Vinh Can Code

Reputation: 427

Some things like this:

$("#submit").click(function(){
        // (DO VALIDATION HERE)
        // show a hidden div to indicate progression
        $('#sayThankYouDiv').show();

        // call AJAX
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function() {
                // finished, handle the results and hide sayThankYouDiv
                $('#sayThankYouDiv').hide();
            }
        });
        return false;
    });
});

Upvotes: 0

Related Questions