Checkout form submit

-- HikaShop version -- : 1810220946

Hi,

We have intergrated jquery validation plugin to validate form fields. All works fine everwhere except checkout guest/address block.

The issue is that on focusing any input and pressing keyboard "enter" or mobile browser "go", the address block is submited those bypassing validation plugin. I also have tried in HikaShop » User addresses menu item which has now ajax submit and there is no such issue.

So before applying any changes to validation plugin it self, is there a way to avoid such behiviour on hikashop level?
Basically i am looking for the part of the code which gives such undesired effect.

For sure tried with protostar template without any modifications and it has same behiviour on checkout as well.

Any help would be appreciated.

Thank you

Hi.

I saw that my issue probably comes from checkout.js file. That's why i created this topic.

Thank you for the new trigger. This now makes things simpler


Kind regarss

Hi,

I am trying to change some behavior in checkout with jQuery validation plugin...

The issue is that when i try to validate address block, i am not able to change guest information ( trying to press button 'change" will return erros in address block ), until address is validated. It seems that "checkoutBlockSubmit" is registering all checkout blocks... Is there a way to check which block you are submiting? So i could have different rules for it?

The code looks like this:

  $("#hikashop_checkout_form").validate({
   rules: {
	 "data[register][email]": {
        required: {
        depends:function(){
            $(this).val($.trim($(this).val()));
            return true;
          }
        },
        lowAllLetters: true,
        email: true
      },
      "data[address_1_4][address_firstname]": {
       required: true,
        capFirstStringLetter: true,
        minlength: 3
      }
   },
   messages: {
	 "data[register][email]": "error email",
     "data[address_1_4][address_firstname]": "error name",
   },
   errorElement: "div",
   errorPlacement: function ( error, element ) {
		error.addClass( "invalid-feedback" );
	    error.insertAfter( element );
	},
	highlight: function ( element, errorClass, validClass ) {
		$(element).addClass( "is-invalid" );
	},
	unhighlight: function (element, errorClass, validClass) {
		$(element).removeClass( "is-invalid" );
    }
 });
	  
window.Oby.registerAjax(['checkoutBlockSubmit'], function(type, cid, pos, element){
      if (!$("#hikashop_checkout_form").valid()) {
        return true;
      }
  });

Hi,

Thanks Nicolas, i have manage to do what i need. However i found some kinda issue with the trigger while doing my customization.

The issue.

While in edit address mode, clearing any address input and pressing ok button will trigger error on that input and it is fine, but after this, i am not able to finish the checkout or go to next step. It's just nothing happens... The "hikabtn_checkout_next" seems doesn't work anymore until i refresh page...

There is no such issue if error is triggered with "Enter" key, it only effects the "ok" button of address block and only after pressing it and triggering the error...

Fixed it with removing the line "onsubmit="if(window.checkout.onFormSubmit){ return window.checkout.onFormSubmit(this); }" inside checkout show.php

So question: Is this me or it could be that the issue is with the trigger?

I lack of knowledge to understand so thought will let you know.

Kind Regards