How to disable the checkout button (and add a message) when the total balance is greater than a certain amount?

[ohmikemike]

Hello,

I have a JS problem I've been trying to solve for a few days now. My payment provider caps at $5,000 per transaction. When the total balance is greater than $5,000, how do I disable the checkout button and provide a message? The issue I'm having right now is getting the [BALANCE] value as a number, so that I can use if/then statement.

Here's what I have so far:



<div id="totalBalanceAmount" class="total_balance">[BALANCE]</div>

<button id="disableCheckoutButton" type="button" onclick="myFunction();doCheckout(this.form,'checko utButton');" class="btn"><i class="icon-basket"></i> [checkout3_submitbutton]</button>
<p id="notifytocall"></p>

<!--START: IF TOTAL IS GREATER THAN OR EQUAL TO 5000-->
<script type="text/javascript">
function myFunction() {
var totalOrderBalance = document.getElementById("totalBalanceAmount").inne rHTML;
document.getElementById("notifytocall").innerHTML = totalOrderBalance;
if (totalOrderBalance < 5) {
document.getElementById("notifytocall").innerHTML = "Your order is more than 5,000 dollars. Please call or email us to place your order. Thank you.";
document.getElementById("disableCheckoutButton").d isabled = true;
}
}
</script>
<!--END: IF TOTAL IS GREATER THAN OR EQUAL TO 5000-->



I checked the data type of "totalBalanceAmount" using typeof, and it says it's string. When I do "parseInt(document.getElementById("totalBalanc eAmo unt").innerHTML);", I get a NaN. Any ideas?

For now, I'm triggering by clicking on the checkout button but eventually I'd like it to be triggered when [BALANCE] changes (e.g., after selecting shipping option). If it helps, I'm using ../assets/templates/v32016-html5/checkout-singlepage-v2.html.

Best,

Mike

[NMTEACO]

A better solution perhaps...

Dont mess with Javascript on the checkout page. My philosophy is if you can do it with system features it's better to do so, that way when things are updated or change, your Javascript does not break, and it's especially important not to break on checkout...

You have a few options using the system as it was designed.

In the payment type settings, set the maximum cart total to $5,000. Then when the total is over 5,000 that payment option will go away.

Then create an offline payment option called "We will Contact you for payment details since this order is over $5,000" and set the minimum cart total to be 5,000 for this payment type.

Best yet would be if your merchant service lets you authorize a card but not actually charge it, then set your second payment type to be authorized only. Then on the backend using virtual terminal just split up the payments.

There is a neat little trick that I dont think many people know, that you can add the same payment method more than once with different rules... So you could have all orders under 5,000 charge right away, and orders over 5,000 authorize only.

Hope this helps.

[Goggles]

Great reply!

[ohmikemike]

Yes, indeed! Awesome reply! Thanks NMTEACO!