This is a question we get a lot:  how can I customize a donation page to behave in a storefront-like fashion -- choosing multiple gift types that result in a single automatically calculated sum?

Mike Heavers of Maverick Digital came up with a nifty solution you can see in action on this donation page.

It's just a bit of script in the page's Custom Donation HTML field, and can easily be tweaked for your own page.

<script language="JavaScript"><!--
function getTotal() {
      document.donation_data.amount.value = parseInt(document.donation_data.memberdues.value) + parseInt(document.donation_data.regamount.value);

    document.donation_data.VARCHAR0.value = document.donation_data.RADIO0.value;
    document.donation_data.VARCHAR1.value = document.donation_data.memberdues.value;
    document.donation_data.VARCHAR2.value = document.donation_data.regamount.value;

}



//--></script>

<br/>

<div class="formRow">

<label for="fc4">Join or renew your membership here: </label>

<select id="fc4" class="blockInput" name="memberdues" onchange="getTotal()">
<option value="0">I do not need to renew my membership</option>
<option value="50">Voting & Assoc Members- Budget under $1m: $50 dues</option>
<option value="100">Voting & Assoc Members- Budget over $1m: $100 dues</option>
<option value="20">Individuals: $20 dues</option>
<option value="10">Students & Seniors: $10 dues</option>
</select>

</div>



<div class="formRow">
<label for="fc34">Registration Fee <span class="required">*</span>: </label>


<select id="fc34" class="blockInput" name="regamount" onchange="getTotal()">
<option selected="">SELECT ONE:</option>
<option value="150">MEMBER-Early Bird Registration Package Only (before 4/17): $150</option>
<option value="225">MEMBER-Early Bird Registration Package w / Gala Ticket (before 4/17): $225</option>
<option value="250">MEMBER-Regular Convention Registration Package Only: $250</option>
<option value="325">MEMBER-Regular Convention Registration Package w/Gala Ticket: $325</option>
<option value="250">NONMEMBER – Early Bird Registration Package ONLY (before 4/17): $250</option>
<option value="450">NONMEMBER – Early Bird Registration Package w/Gala Ticket (before 4/17): $450</option>
<option value="350">NONMEMBER – Regular Convention Registration Package ONLY: $350</option>
<option value="550">NONMEMBER – Regular Convention Registration Package w/Gala Ticket: $550</option>
<option value="200">Gala Only Ticket - $200</option>
</select>
</div>
<br/>

<div class="formRow">
<label for="amount">Total Amount: </label>
<input type="text" name="amount" readonly="readonly">
</div>



<input type="hidden" name="VARCHAR0" >
<input type="hidden" name="VARCHAR1" >
<input type="hidden" name="VARCHAR2" >

<input type="hidden" value="Email,RADIO0,First_Name,Last_Name,Street,City,State,Zip,regamount,amount" name="required"/>