asked on

Issue configuring a dropdown selector on a donation form.

Hello,

For my client's site they require a donation form to popup in a modal window. The donation form will accept payments using Paypal. The form needs to have two options.

The first option is to have a dropdown menu where the visitor can choose a pre-specified amount to donate. For example they can choose $20, $30, $40 etc...

The second is the ability to choose which day of the month to make monthly recurring donations.

The visitor should then be able to link to paypal and have their monthly donation processed.

I have the areas setup, however when the Donation button is clicked, I get a message saying to "Please enter the amount you wish to donate and try again."

So it looks like the donate button is not recognizing the amount chosen in the dropdown menu's donation amount.

The test development site is http://eradicatepoverty.net/indexGallery.html. Click the donate button on the menu and it will automatically scroll down to a section called How Can You Help. Click the second option that says Donate for Kitchen.

It brings up a modal window with the information.

I have included a screenshot for reference.

Any help would be greatly appreciated.

Thank you,
Tia

hielo

>> if (jQuery('#input_amount').val() > null)
I don't see anything with id="input_amount". So give the select the id:
<select name="os0" id="input_amount">

Also, change the above to:
if ( jQuery('#input_amount').val() !== null )

tiabradford1984

ASKER

I just updated the code, but unfortunately received the same message :

"Please enter the amount you wish to donate and try again."

Tia

hielo

Your <option> values have a dollar sign. So change:
if (jQuery('#input_amount').val() < minimum_value)

to:

if ( parseFloat(jQuery('#input_amount').val().replace('$','')) < minimum_value)

Open in new window

tiabradford1984

ASKER

Thank you for your reply. I changed the code and received the same error message.

I have included a screenshot of the jquery script with the portion I have changed.

Tia

hielo

If you open your page in Chrome; right-click anywhere > console, then reload your page, you will see errors. This one in particular:
Uncaught ReferenceError: SyntaxHighlighter is not defined

is a runtime javascript error. Comment out the SyntaxHighlighter block at the end, and report back if you still have problems.

tiabradford1984

ASKER

Hello,

I commented out that script block. It was for the slider at the bottom of the page, so the Gallery is now disabled, but I have the same error message.

Tia

ASKER CERTIFIED SOLUTION

hielo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

SOLUTION

Rob

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

tiabradford1984

ASKER

Thank you for your responses. It looks like I am almost there. The button now brings me to paypal site, only the term and amountare not showing on the paypal page. I have a screenshot.

Tia

hielo

On your second form you are using:
<select name="os0" id="input_amount">...</select>
<select name="t3" class="select">...</select>

Perhaps you meant:
<select name="amount" id="input_amount">...</select>
<select name="term" class="select">...</select>

tiabradford1984

ASKER

I made this change to the form

<select name="os0" id="input_amount">...</select>
<select name="t3" class="select">...</select>

Perhaps you meant:
<select name="amount" id="input_amount">...</select>
<select name="term" class="select">...</select>

The fields still show blank in paypal though.

Tia