Checkout's Next button requires extra click

It looks like any time anything is changed the Next button actually behaves as an Update button and brings you back to the same checkout page. The order only goes forward if you click Next without having changed any other fields. This *might* be desirable behavior, but there is no visual indication of what is going on in the UI so it is a confusing experience. I would expect to have an Update button to handle field changes and some sort of Submit button to proceed to the next step in checkout. Barring that, there *at least* needs to be a message of some sort explaining why we're back on the same page again.

One way to handle this would be to label the button Update whenever any required fields are not yet filled in. Once everything is there it could change to Order Now or something obvious like that. If fields get changed it could revert to Update using Javascript. These little clues help people feel comfortable with what's going on and it helps avoid worries like "how many times did I just order that?"

There is a navigation bar for the checkout process. You can enable it in the settings.

Yes, i had the same issue. There is a little note down the bottom that tells you your payment method, and that updates when u change from paypal to bank transfer.
However, I've shopped online for years, and it got me stuck for a while. I'd change payment method, click next, and was still on the same screen. Until after about 10 goes I noticed the little line of text at the bottom of the screen, showing me i'd changed the payment method.

I agree, an Update button, and/or a submit button. It's a bit confusing.

Hi Nicolas,

I have the same issue at the first step of the checkout (address selection), i realize this is because i have deactivated the auto submit option of the checkout tab of the configuration.

However i need this disabled to prevent users from trying to edit the address by directly clicking on it, because it will send them to the next step instead of enabling them to edit the address.

Is there any other way to force the "next" button to continue upon the first click?
I've tried finding a similar item as the input tag (view payment) in the address and address_view to add the onclick="this.form.submit(); return false;" code, but without luck.

Is there anywhere else where i can add this JS?

I've tried adding it to the view address_view, it does enable the auto submit, but it makes the address "clickable to proceed" again..

Maybe we can fix this the other way around? By disabling the link to proceed at the billing/shipping address at the address view..?

Tried that, but it just diables the auto submit again, which means the customer has to click the proceed button twice again.

Auto submit would be the solution, if it would not make the address text itself a link

Tried that now, thought it would just switch the auto submit off/on (0/1)

In the view: adress 0
In the view: address_view 1

Same result, auto submit is enabled and the address itself links to the next page

Tried reversing it:
In the view: adress 1
In the view: address_view 0

Now, auto submit is disabled, which results in the next button needed to be clicked twice
Obviously, the view address_view is processed after the view address, and affects the whole address step of the checkout.

I've also sought everywhere to find the code that makes the address itself a link, (e.g. <a> tags) but without luck..

Any other thoughts on this?

Ah, i thought the payment view was just for the payment screen.. So i've tried that now..
The auto submit is now disabled at the address selection screen, now when i click the button to continue to the next page; the same page reloads again(address selection)..

Ps. (With the auto submit code enabled (1) at the checkout/payment view) The behaviour at the payment screen is fine and as expected, you can select a different payment method by clicking on the logo without it getting auto submitted and proceeding to the next page. Also when this is done, just 1 click is enough to finish the order.

Yes, then i did understand it correctly..

However, the problem is just on ONE view, only the address view (address selection screen).

Problem still is, i need auto submit enabled so 1 click on the next button is enough, but i do not want the side effect, that addresses are made into links, because that's confusing. (people will think they can edit the address by clicking on it).



I've tried disabling auto submit in the beginning of the view, and to put it back on somewhere further down the view to make the next button work ok.
I figured the next button would be rendered somewhere below this code

<div class="hikashop_checkout_shipping_div" id="hikashop_checkout_shipping_div" <?php echo $style;?>>
			<?php

$this->type = 'billing';
			echo $this->loadTemplate('view');

$this->type = 'shipping';
				echo $this->loadTemplate('view');

I see, thank you very much, that worked!

However, now when have edited the shipping address, the next button still needs to be clicked twice..?
I don't understand why though, have enabled the auto submit in the configuration, and to be sure i've also put the enable code in the view.

I'm guessing because i removed the label, i've also removed the auto submit?

Now I understand. From this link: " $this->config->set('auto_submit_methods',1); " changing 1 to 0 or vice versa will activate and deactivate auto submit. I wasn't able to figure this out. lol.. Thanks for this one, Nico.