Snippets

Tessitura Network Community Set a minimum value for the TNew Checkout page donation

Created by Stephen Barnhouse
//
// This snippet sets a minimum amount for the checkout page Donation Ask
// by adding a handler to the Add Donation button on the /cart/payment page.
// 


// In the TNew Template code, in _Layout.cshtml
<script type="text/javascript">

$(document).ready(
    function () {
        RequireMinimumDonation();
        // other stuff here ...
    }
);

// Set a minimum of $25 for the checkout donation
function RequireMinimumDonation() {
    var pathname = window.location.pathname.toLowerCase();
    // run this script on the payment page
    if (pathname.indexOf("cart/payment") === -1) {
        return;
    }
    // Change the name attribute to disable TNew's default validation which complains prematurely if the value is empty or 0
    $("input#PaymentDonation_Amount").attr("name", "NoName");

    // Setting the min attribute here controls the up-down arrow control in the input
    $("input#PaymentDonation_Amount").attr("min", 25);
    
    // Add a handler to the button click event
    $("button#tn-add-donation-button").click(function (event) {
        var inputVal = $("input#PaymentDonation_Amount").val();
        if (inputVal < 25) {
            // Set the error state and message for the control
            $("div.form-group[data-control-group-for='PaymentDonation.Amount']").addClass("has-error");
            $("div.help-block[for='PaymentDonation.Amount']").text("Please enter a minimum of $25");
            
            // Set the error state and message for the page header
            $("div.tn-heading-error").addClass("bg-danger alert");
            $("div.tn-heading-error").text("Please enter a minimum donation of $25");
            
            // Don't submit the form
            event.preventDefault();
            return false;
        }
        else {
            // Clear the error state and messages
            $("div.form-group[data-control-group-for='PaymentDonation.Amount']").removeClass("has-error");
            $("div.help-block[for='PaymentDonation.Amount']").text("");
            $("div.tn-heading-error").removeClass("bg-danger alert");
            $("div.tn-heading-error").text("");
            
            // And submit the form
            $("form#tn-add-donation-form").submit();
        }
    });
    
</script>

Comments (0)

HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.