Jump to content

Radio button on Checkout instead of Dropdown


Claudia M

Recommended Posts

I have followed the post to add radio button on checkout instead of the dropdown.  I got it to show but it is not auto updating when I change the shipping product. See below.  It won't auto update to Priority when it is selected.  When I click "Continue to Secure Checkout" it does show the updated shipping amount, but I want it to update as soon as the new shipping is selected. Thanks for any and all help.

5a359b2293efe_radiobutoncheckout.PNG.94e1b8a87e7b8370e4dda715c63e5760.PNG

here is my code change in content.checkout-medium-up:

{if isset($SHIPPING)}
         <tr>
            <td colspan="4">
              <span class="txt pad-top">Select your shipping method  </span><br />
             <span class="txt-med" style="font-weight:normal; padding-bottom:0.625rem!important;"> This may change when your actual delivery address is known</span>
                <ul class="no-bullet center" style="margin-top: 0rem!important;margin-bottom: 0rem!important;">
                  {foreach from=$SHIPPING key=group item=methods}
                  {foreach from=$methods item=method}
                  <li class="prod-details-li-txt-last">
                    <input name="shipping" type="radio" value="{$method.value}" id="{$method.value}" {$method.selected|replace:'selected':'checked'}><label for="{$method.value}">{$method.display}</label>
                  </li>
                  {/foreach}
                  {/foreach}
                  </ul>
         </td>            <td class="bgw">{$LANG.basket.shipping}<br />
              


and here is the change I made in js/2.cubecart  Line 82:

  $(".autosubmit select, .autosubmit input[type='radio']").not('.nosubmit').change(function() {
        $(this).parents(".autosubmit").submit();

 

 

 

Edited by Claudia M
Link to comment
Share on other sites

Recall that when making changes to a page's resources (CSS, javascript, images), you will need to force your browser to fetch fresh copies of those resources. This is usually done with the keyboard shortcut CTRL-F5.

If you have done that, we may need to closer at your template code.

Unless you are experimenting with another installation of CubeCart, I do not see the changed file.

Line 82 of a freshly fetched copy:

$(".autosubmit select").not('.nosubmit').change(function() {

 

Link to comment
Share on other sites

I had opened up the Shipping Estimates to always be present. If I change the shipping cost selection then click Get Shipping Rates it will update the rate right then.  The problem is if the customer is logged in then the shipping estimate, so the get shipping rates button, is not there so the shipping rates aren't updated.

.5a35acc1b0263_radiobuttonchwithestimate.PNG.9cd3cde45b5bddd28a6174d57c08582e.PNG

.... Is it now changed? Maybe use the editor in the control panel?

I don't know what you mean by that.  That is the code in the file via control panel.

Link to comment
Share on other sites

Well don't I feel stupid.  All along I thought I had given you the code below and I wasn't.  Was looking right at the stock code and thought it was the edited code.  I am so sorry.  I made the change (I thought I already had!) and it is working now.

$('.autosubmit select, .autosubmit input[name="shipping"]').not('.nosubmit').change(function() {
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...