Radio Buttons Follow

Overview

A radio button or option button is a type of graphical user interface element that allows the fan to choose only one of a predefined set of options. Basically, it allows you to present multiple offers (buy buttons spins) through a single front-end purchase button.

Instructions for using radio button selectors with buy buttons

Here's an example site: http://store.paulmccartney.com/bandontherun/

Add offers.js to the file...

Example: 

<script type="text/javascript" src="offers.js"></script>

 

Edit offers.js to reflect all offers:

 

var RADIO_OFFERS = {
    'download' : {aId:1666,cId:10051438,persist:true},
    'download+shirt' : {aId:1666,cId:10051449,persist:true},
    'cd+download' : {aId:1666,cId:10051474,persist:true},
    'cd+download+shirt' : {aId:1666,cId:10051475,persist:true},
    'vinyl+download' : {aId:1666,cId:10051476,persist:true},
    'vinyl+download+shirt' : {aId:1666,cId:10051477,persist:true},
    'photop+download' : {aId:1666,cId:10051575,persist:true},
    'photop+download+shirt' : {aId:1666,cId:10051575,persist:true},
    'vinylp+download' : {aId:1666,cId:10051582,persist:true},
    'vinylp+download+shirt' : {aId:1666,cId:10051582,persist:true},
    'shirt' : {aId:2123,cId:10049509,persist:true}
};

function radioValue (radioGroup) {
    if (radioGroup)
    {
        for (var i = 0; i < radioGroup.length; i++)
        {
            if (radioGroup[i].checked)
            {
                var retVal = radioGroup[i].value;
                radioGroup = null;
                return retVal;
            }
        }
    }
    return null;
};

function radioSelect (formRef) {
    var radios = formRef;
    var value = radioValue(radios);
    if (value === null) {
        alert("Please select a package.");
    }
    var initHash = RADIO_OFFERS[value];
    if (initHash) {
        TSPurchase.load(initHash);
    }
}

 

Edit form for each item to be sold

Examples:

Digital and Digital + T-Shirt 
InstantKarma.pngEdit Plugin:img 

<form id="digitalform" name="digitalform">
<input type="radio" name="digital" id="download" value="download" checked="checked" /> <label for="download">Digital: $8.00</label> <br/>
<input type="radio" name="digital" id="download+shirt" value="download+shirt" /> <label for="download+shirt">Digital + T-Shirt: $25.00 +S&H</label><br>
</form>

<a href="http://www.google.com/finance/converter?a=10.00&from=USD&to=GBP" class="view-details currency">»Convert Currency</a>                     
<a href="javascript:void(0);" onclick="radioSelect(document.forms.digitalform.digital); return false;" class="buy-bttn"></a>


Add a Shirt to any Order
  

RadioEx2.png

 

<form id="deluxeform2" name="deluxeform2">
<input type="radio" name="deluxe2" id="photop+download+shirt" value="photop+download+shirt" checked="checked"/> <label for="photop+download+shirt">Photo Book Package: $55.00 +S&H</label> <br/>
<input type="radio" name="deluxe2" id="vinylp+download+shirt" value="vinylp+download+shirt" /> <label for="vinylp+download+shirt">Vinyl Package: $40.00 +S&H</label> <br/>
<input type="radio" name="deluxe2" id="vinyl+download+shirt" value="vinyl+download+shirt" /> <label for="vinyl+download+shirt">12" Vinyl + T-Shirt: 30.00 +S&H</label> <br/>
<input type="radio" name="deluxe2" id="cd+download+shirt" value="cd+download+shirt" /> <label for="cd+download+shirt">CD + T-Shirt: $25.00 +S&H</label><br/>
<input type="radio" name="deluxe2" id="download+shirt" value="download+shirt" /> <label for="download+shirt">Digtial + T-Shirt: $25.00 +S&H</label><br/>

</form>
<a href="javacript:void(0);" onclick="radioSelect(document.forms.deluxeform2.deluxe2); return false;" class="buy-bttn deluxe-pck" style="top:15px;"></a>
Have more questions? Submit a request and our team will be able to help get you sorted.
Powered by Zendesk