JSFiddle - React, Tailwind, and code Playground

HTML

<form id="form_paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
    <input type="hidden" name="business" value="mail@url.url"/>
    <input type="hidden" name="cmd" value="_xclick"/>
    <input type="hidden" name="return" value="http://returnpage.url"/>
    <input type="hidden" name="cancel_return" value="http://cancelreturnpage.url"/>
    <input type="hidden" name="rm" value="2"/>
    <input type="hidden" name="currency_code" value="USD"/>
    <input type="hidden" name="quantity" value="1"/>
    <input type="hidden" name="item_name" value="Item Name"/>
    <input type="hidden" name="item_number" value="Item ID"/>
    
    <label>Amount (US$) : </label>
    <input type="text" name="amount" id="input_amount" class="text" />
    
    <input type="hidden" name="invoice" value="Post ID"/>
    <input type="hidden" name="cbt" value="Make Payment &rarr;"/>
    <input type="hidden" name="item_number" value="Item ID"/>
    <input type="submit" name="submit" value="Confirm & Pay &rarr;" class="submit" />
    <br/>
    <span id="msg_moreamount" class="icon_warning red" style="display:none;">PayPal takes $0.35 commission for a $1 donation.</span>
    <span id="msg_noamount" class="icon_warning red" style="display:none;">Please enter an amount and try again.</span>
    <span id="msg_activity" style="display:none;"> <img src="loader.gif" align="middle" alt="load"/>&nbsp;Transferring to PayPal, please wait...</span>
    
    <p>-2% of the price it will be <b>$<span class="text_decoration" id="site_commission_box"></span> USD</b>.</p>
</form>

CSS

.red {color:#ff0000;}
.icon_warning {background:transparent url(exclamation.png) left no-repeat;padding:4px;padding-left:20px;}
form#form_paypal input {padding:3px;border:1px solid #ddd;background:#fefefe;}
form#form_paypal input#input_amount {width:50px;}
form#form_paypal .submit {cursor:pointer;border-style:outset;}

JavaScript

function calculateDiscount(price) {
    // todo: check type and it would be better to use integer instead of floats...
    return price - (price * 0.02);
}

jQuery(document).ready(function() {
    // the minimum required value to be entered.
    // in this case PayPal takes $0.35 from a $1
    // donation, hence we ask for at least $1.35
    var minimum_value = 1.35;

    // attach this script to the form's submit action
    jQuery('#form_paypal').submit(function() {
        // check if there is an amount entered
        if (jQuery('#input_amount').val() > null) {
            // is the amount equal to or higher than the minimum_value?
            if (jQuery('#input_amount').val() < minimum_value) {
                // need more amount
                // hide messages, show more amount error
                jQuery('#msg_noamount').hide();
                jQuery('#msg_moreamount').fadeIn();
                return false; // prevent the form from submitting
            }
            else {
                // amount is more than minimum_value
                // hide messages, show activity
                jQuery('#msg_moreamount').hide();
                jQuery('#msg_noamount').hide();
                jQuery('#msg_activity').fadeIn();
                return true; // submit the form
            }
        }
        else {
            // no amount entered at all
            // hide messages, show no amount error
            jQuery('#msg_moreamount').hide();
            jQuery('#msg_noamount').fadeIn();
            return false; // prevent the form from submitting
        }
    });

    // event handler to calculate and show the discount
    $('#input_amount').change(function() {
        var discount = calculateDiscount($(this).val());
        $('#site_commission_box').text(discount);
    });
});