WordPress.org

Forums

WP eCommerce
Changing variant dropdowns to radio buttons (2 posts)

  1. mflotron
    Member
    Posted 9 months ago #

    Store URL: http://emflow.org/atlarge/shop/t-shirt/atlarge-mask-2-navy-2/
    WordPress version: 3.9.1
    WP e-Commerce version: 3.8.14.1
    Gold Cart version: 2.9.7.8
    Theme: custom

    I am trying to replace the usual Product Variation drop down menu on the single product page with a radio button. Specifically, instead of having a drop down for T-Shirt Size, I want radio buttons. You'll see exactly what I'm trying to do on the page right now (it's not live yet): http://emflow.org/atlarge/shop/t-shirt/atlarge-mask-2-navy-2/

    For some reason none of the radio buttons can be selected. There is CSS to make the button's bg-color red instead of black and this does not happen. Also, if I click on one, then attempt to Add to Cart, it reports that I have not made a choice.

    My code is:

    <div class="wpsc_variation_forms">
                            	<table>
    
    							<?php while (wpsc_have_variation_groups()) : wpsc_the_variation_group(); ?>
    
    								<tr><td class="col1"><?php echo wpsc_the_vargrp_name(); ?>:</td>
    
    								<?php /** the variation HTML and loop */?>
    
    								<td class="col2">
    
                                    <?php while (wpsc_have_variations()) : wpsc_the_variation(); if ( 0 == wpsc_the_variation_id() ) { // That is usually a label and not an actual variation
            continue;
        } ?>
    
                                    <input class="wpsc_select_variation" type="radio" name="variation[<?php echo wpsc_vargrp_id(); ?>]" value="<?php echo wpsc_the_variation_id(); ?>" id="<?php echo wpsc_the_variation_id(); ?>" >
                                    <label for"<?php echo wpsc_the_variation_id(); ?>"><?php echo wpsc_the_variation_name(); ?></label>
    
    								<?php endwhile; ?>
    
                                    </td></tr> 
    
    							<?php endwhile; ?>
    
                                </table>
    
       							<!--close wpsc_variation_forms-->

    And I am replacing this original code from theme file:

    <div class="wpsc_variation_forms">
                            	<table>
    							<?php while (wpsc_have_variation_groups()) : wpsc_the_variation_group(); ?>
    								<tr><td class="col1"><label for="<?php echo wpsc_vargrp_form_id(); ?>"><?php echo wpsc_the_vargrp_name(); ?>:</label></td>
    								<?php /** the variation HTML and loop */?>
    								<td class="col2"><select class="wpsc_select_variation" name="variation[<?php echo wpsc_vargrp_id(); ?>]" id="<?php echo wpsc_vargrp_form_id(); ?>">
    								<?php while (wpsc_have_variations()) : wpsc_the_variation(); ?>
    									<option value="<?php echo wpsc_the_variation_id(); ?>" <?php echo wpsc_the_variation_out_of_stock(); ?>><?php echo wpsc_the_variation_name(); ?></option>
    								<?php endwhile; ?>
    								</select></td></tr>
    							<?php endwhile; ?>
                                </table>
       							<div id="variation_display_<?php echo wpsc_the_product_id(); ?>" class="is_variation"><?php _e('Combination of product variants is not available', 'wpsc'); ?></div>
    						</div><!--close wpsc_variation_forms-->

    Any help is much appreciated!

    https://wordpress.org/plugins/wp-e-commerce/

  2. whitelamp
    Member
    Posted 9 months ago #

    My guess is you should have a look at:
    wpsc-core/js/wp-e-commerce.js
    1163: jQuery( 'div.wpsc_variation_forms' ).on( 'change', '.wpsc_select_variation', function() {

    then perhaps create your own class and function

Reply

You must log in to post.

About this Plugin

About this Topic