diff options
author | Alex Legler <alex@a3li.li> | 2016-10-14 13:35:36 +0200 |
---|---|---|
committer | Alex Legler <alex@a3li.li> | 2016-10-14 13:35:36 +0200 |
commit | 1e2cee911253fb3ee38aa305e97fa1f4ac7cd515 (patch) | |
tree | 15557d7b3b651696838c4502753ceaf49eed2e1b /donate/index.html | |
parent | Whitespace fix (diff) | |
download | www-1e2cee911253fb3ee38aa305e97fa1f4ac7cd515.tar.gz www-1e2cee911253fb3ee38aa305e97fa1f4ac7cd515.tar.bz2 www-1e2cee911253fb3ee38aa305e97fa1f4ac7cd515.zip |
Improve donation checking UX
Diffstat (limited to 'donate/index.html')
-rw-r--r-- | donate/index.html | 21 |
1 files changed, 11 insertions, 10 deletions
diff --git a/donate/index.html b/donate/index.html index 8aa2f05..d36d368 100644 --- a/donate/index.html +++ b/donate/index.html @@ -30,12 +30,13 @@ layout: tyrian <br><br> <script type="text/javascript"> function validate_donation_form() { - var amount_str = document.forms["donate-form"]["amount"].value; + var input_field = $('#donation-amount'); + + var amount_str = input_field.value; var amount_num = +amount_str; // unary conversion op - if (isNaN(amount_num)) { - return false; - } - if (amount_num < 5.00) { + if (isNaN(amount_num) || amount_num < 5.00) { + $('#donation-input-group').addClass('has-error'); + $('#min-notice').addClass('text-danger'); return false; } return true; @@ -52,9 +53,9 @@ layout: tyrian <input type="hidden" name="currency_code" value="USD"> <input type="hidden" name="return" value="https://www.gentoo.org/donate/thanks.html"> <input type="hidden" name="cancel_return" value="https://www.gentoo.org/donate/cancel.html"> - <div class="input-group input-group-lg"> + <div class="input-group input-group-lg" id="donation-input-group"> <span class="input-group-addon">US $</span> - <input type="text" class="form-control" placeholder="Enter Amount" name="amount" min="5.00" step="0.01"> + <input id="donation-amount" type="number" class="form-control" placeholder="Enter Amount" name="amount" min="5.00" step="0.01" required> <span class="input-group-btn"> <button class="btn btn-danger" type="submit"><span class="fa fa-fw fa-heart"></span> Donate!</button> </span> @@ -63,9 +64,9 @@ layout: tyrian <br> <small> You can use this form even if you don't have or want to create a PayPal account. - On the next screen, you can pay with your credit card instead. Please note that - there is a US$ 5 minimum, and you may be contacted to confirm your donation is - not fraudulent. + On the next screen, you can pay with your credit card instead. + <span id="min-notice">Please note that there is a US$ 5 minimum</span>, + and you may be contacted to confirm your donation is not fraudulent. </small> </div> </div> |