0

I need to submit the ajax form after checking if all the qty boxes has value, if any 1 qty box is empty then stop form submit.

For this, I used below code but it is not working as excepted. I need to remove ajax request from foreach loop. Can some one guide me on this?

require(["jquery"], function ($) {
    $(document).ready(function () {
        $('#submit').click(function () { // The button type should be "button" and not submit
            var body = $('body').loader();
                    body.loader('show');
            if ($('#enquiry-form').valid()) {
                var string = "<?php echo $item_arr; ?>"; 
                var array = string.split(',');
                $.each(array, function( index, value ) {
                    if (!($('#cart-'+value+'-qty').val())) {
                    alert("Please enter required qty");
                    return false;
                    }else{
                        $.ajax({
                            type : 'POST',
                            url : "<?php echo $block->escapeHtml($block->getFormAction()); ?>",
                            data : jQuery('#enquiry-form').serialize(),
                            success: function(response){
                                var body = $('body').loader();
                                body.loader('show');
                                var returnedData = JSON.parse(response);
                                // alert(returnedData.message);
                                if (returnedData.type == 'success') {
                                    window.location.href = "<?php echo $this->getBaseUrl().'inquiry/index/success'; ?>";
                                }else if(returnedData.type == 'error'){
                                    alert(returnedData.message);
                                }else{
                                    alert(returnedData.message);
                                }
                            }
                            });
                    }
                });
            }
        });
    });
});
  • I'm assuming this is a custom form? You are already checking if the #enquiry-form is valid with the jQuery validate plugin, couldn't you make the Qty fields required so they also get checked? That way you can simplify that whole thing. – Readio May 12 at 7:05
  • what is $item_arr value? – Devidas May 12 at 8:24
1

try this

<script type="text/javascript">

  require(["jquery"], function ($) {
    $(document).ready(function () {
        $('#submit').click(function () { 
         // The button type should be "button" and not submit
            var body = $('body').loader();
            body.loader('show');
            var qtyarraynotexist = new Array();
           if ($('#enquiry-form').valid()) {
                var string = "<?php echo $item_arr; ?>"; 
                var array = string.split(',');
                $.each(array, function( index, value ) {
                    if (!($('#cart-'+value+'-qty').val())) {
                      qtyarraynotexist += 1;
                      alert("Please enter required qty");
                      return false;
                    }
                  });
                    if (qtyarraynotexist && qtyarraynotexist.length > 0) {
                      alert("Please enter required qty");
                      return false;
                    }else{
                        $.ajax({
                            type : 'POST',
                            url : "<?php echo $block->escapeHtml($block->getFormAction()); ?>",
                            data : jQuery('#enquiry-form').serialize(),
                            success: function(response){
                                var body = $('body').loader();
                                body.loader('show');
                                var returnedData = JSON.parse(response);
                                // alert(returnedData.message);
                                if (returnedData.type == 'success') {
                                    window.location.href = "<?php echo $this->getBaseUrl().'inquiry/index/success'; ?>";
                                }else if(returnedData.type == 'error'){
                                    alert(returnedData.message);
                                }else{
                                    alert(returnedData.message);
                        }
                      }
                  });
                }
            }
        });
    });
});


</script>

I have checked in each empty or not. if the value of the qty box is empty then set one flag. then check the flag value set or not if set then executes ajax request(because of no flag set means all qty box is available to value).

I hope this will help you.

| improve this answer | |
  • Thanks bro.. I also got same idea.. – Arjun May 12 at 10:01
  • Most Welcome..! – Devidas May 12 at 10:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.