<script type="text/javascript">
    var addonRecurringPrices = new Array();
    var addonSetupPrices = new Array();
    var addonTaxable = new Array();
    <!-- BEGIN DYNAMIC BLOCK: packageAddonsPriceArr -->
        addonRecurringPrices[{ADDON_ID}] = new Array();
        addonSetupPrices[{ADDON_ID}] = new Array();
        addonTaxable[{ADDON_ID}] = {ADDON_TAXABLE};
        <!-- BEGIN DYNAMIC BLOCK: packageAddonsPriceArrItem -->
        <!-- BEGIN DYNAMIC BLOCK: packageAddonsPriceItemInit -->
        addonRecurringPrices[{ADDON_ID}][{ADDON_PRICE_ID}] = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0);
        <!-- END DYNAMIC BLOCK: packageAddonsPriceItemInit -->
        <!-- BEGIN DYNAMIC BLOCK: packageAddonsPriceArrItemCycle -->
        addonRecurringPrices[{ADDON_ID}][{ADDON_PRICE_ID}][{ADDON_RECURRINGPRICE_CYCLE}] = {fullPrice: {ADDON_PRICE_FLOAT}, proratedPrice: {ADDON_PRICE_FLOAT_PRORATED}};
        <!-- END DYNAMIC BLOCK: packageAddonsPriceArrItemCycle -->
        addonSetupPrices[{ADDON_ID}][{ADDON_PRICE_ID}] = {ADDON_SETUPPRICE_VALUE};
        <!-- END DYNAMIC BLOCK: packageAddonsPriceArrItem -->
    <!-- END DYNAMIC BLOCK: packageAddonsPriceArr -->
</script>

<table id="tableAddons" width="100%" cellpadding="4" cellspacing="1" border="0">
    <!-- BEGIN DYNAMIC BLOCK: packageAddonsRow -->
    <tr align="center">
        <td width="35%" align="right" class="step3tdbg">
           {ADDON_NAME}&nbsp;{ADDON_DESCRIPTION}:
        </td>
        <td width="65%" align="left">
            <select name="addonSelect_{ADDON_ID}" class="dropdown" onchange="regenerateBill()">
                <!-- BEGIN DYNAMIC BLOCK: packageAddonsPrices -->
                <option value="addon_{ADDON_ID}_{ADDON_PRICE_ID}_{ADDON_RECURRINGPRICE_CYCLE}" {ADDON_PRICE_SELECTED} >{ADDON_PRICE}</option>
                <!-- END DYNAMIC BLOCK: packageAddonsPrices -->
            </select>
        </td>
    </tr>
    <!-- END DYNAMIC BLOCK: packageAddonsRow -->
    <!-- BEGIN DYNAMIC BLOCK: packageAddonsRow2 -->
    <tr align="center">
        <td width="75%" align="left">
        
            <style>
                tr.packageAddonRow:hover{
                    background:#FDE0E0;
                }
            </style>
            
            <table align="center" width="300" border="0" cellpadding="0" cellspacing="0" >
                <tr>
                    <td colspan="2" style="padding-bottom:7px;">
                        <b>{ADDON_NAME}&nbsp;{ADDON_DESCRIPTION}</b>
                    </td>
                </tr>
                <!-- BEGIN DYNAMIC BLOCK: packageAddonsPrices2 -->
                <tr class="packageAddonRow" onClick="$('{ADDON_ID}_{ADDON_PRICE_ID}_{ADDON_RECURRINGPRICE_CYCLE}').checked = true; regenerateBill();">
                    <td style="text-align:left; width:10px; padding-right:5px;">
                        <input type="radio" name="addonSelect_{ADDON_ID}" class="dropdown" id="{ADDON_ID}_{ADDON_PRICE_ID}_{ADDON_RECURRINGPRICE_CYCLE}" onClick="regenerateBill();" value="addon_{ADDON_ID}_{ADDON_PRICE_ID}_{ADDON_RECURRINGPRICE_CYCLE}" style="background:none; border:0px;" {ADDON_PRICE_SELECTED}/>
                    </td>
                    <td style="vertical-align:middle; text-align:left; width:100%; font-size:11px;">
                        <label for="addonSelect_{ADDON_ID}">{ADDON_PRICE}</label>
                    </td>
                </tr>
                <!-- END DYNAMIC BLOCK: packageAddonsPrices2 -->
            </table>
        </td>
    </tr>
    <!-- END DYNAMIC BLOCK: packageAddonsRow2 -->
</table>
