WEB/src/Template/Element/Eprosume/Views/transfer.ctp

<script>
    (function($) {
        var overlay = $("#eprosume_overlay");
        var errors = $("#transferErrors");
        var outcome = $("#transferOutcome");
        var prosumerSelect = $("#prosumerSelect");
        var amountInput = $("#amountInput");
        var assetSelect = $("#assetSelect");
        var memoInput = $("#memoInput");
        var submitButton = $("#submitButton");
        if(submitButton) {
            submitButton.click(function(e) {
                var amount = parseFloat(amountInput.val());
                outcome.html("");
                outcome.addClass("hidden");
                e.preventDefault();
                if(prosumerSelect.val() == 0) {
                    errors.html("Select a Meter");
                    errors.removeClass("hidden");
                    return;
                }
                if(amount == null || isNaN(amount) || amount <= 0) {
                    errors.html("Set an amount");
                    errors.removeClass("hidden");
                    return;
                }
                if(assetSelect.val() <= 0) {
                    errors.html("Choose an asset type");
                    errors.removeClass("hidden");
                    return;
                }
                if(memoInput.val().length <= 0) {
                    errors.html("Please. insert a transfer memo");
                    errors.removeClass("hidden");
                    return;
                }

                errors.html("");
                errors.addClass("hidden");
                overlay.show();
                $.ajax({
                    url : "/xhr/transfer",
                    type: "POST",
                    contentType: "application/json",
                    headers: {
                        "X-CSRF-Token": <?= json_encode($this->request->getParam('_csrfToken')) ?>
                    },
                    data: JSON.stringify({
                        amount: amount,
                        asset: assetSelect.val(),
                        memo: memoInput.val(),
                        prosumer: prosumerSelect.val(),
                    }),
                    complete:function(xhr) {
                        if(xhr.status == 200) {
                            outcome.html("The transfer has been successfully processed. The registration of this may take some time. Reloading...");
                            outcome.removeClass("hidden");
                            $('#submitButton').addClass("hidden");
                            setTimeout(
                                () => { window.location.reload(); },
                                5000
                            );
                        } else {
                            outcome.html("Sorry, an error occured while processing you transaction");
                        }
                        outcome.removeClass("hidden");
                        overlay.hide();
                    }
                });
            });
        }
    })(jQuery);
</script>