Home » Forums » Focus Groups » Theming and Design

Howto get selected shipping method with jquery

Submitted by boregcz on Fri, 11/14/2008 - 01:42
boregcz
Posts: 2
 Joined: 11/14/2008

Hi all,
beforehand i'd like to sorry for my English :\

I'm trying to get selected shipping method with jquery, but its not working. Think that its because the shipping methods are generated with jquery, cause when i use code below, it works only for payment methods, but they have the same class "form-radio" like shipping one.

$(document).ready(function(){
  $("input.form-radio").click(function(event){
     alert("Clicked");
  });
});

I tried to place button "Get shipping method" witch is placed at the top of the checkout page, and it works:

<input type="button" value="GET shipping method" onclick="alert($('input[@name=quote-option][@checked]').val())"/>

but i need to get the shipping method when i click (select, check) the radio button, cause i want to hide some payment methods witch are not valid when using specific shipping method.
E.g.: When i choose "In store pickup", i dont want the "COD method" (called "Dobírka" on my site) - its nonsence.

I tried to use this code, but it didnt work:

$(document).ready(function() {
  var pokus = $("input[@name=quote-option]").click(function() {
    var choosed = $("input[@name=quote-option]").val();
    alert(choosed);
  });
});

I found here on the forum, that it is not possible to show payment methods based on selected shipping method, but think that its possible to do something like:
adding "hide" class to specific payment methods when specific shipping method is checked.

Its very important for our background - Czech Republic, cause COD is our most offen payment method, so for users its very confusing and unusable in essence.

The site is here: DEMO Ubercart.cz.

I use Ubercart 5.x-1.6 and Drupal 5.12 - the site is thoroughly updated.

Thanx all
permalink #1 Fri, 11/14/2008 - 10:13
Ryan

Posts: 5625
 Joined: 08/07/2007
AdministratorHead Code Monkey - I eat bugs.

Hmm... your approach sounds reasonable. Have you tried something like the JS found in uc_quote.js for adding actions to those radio buttons?

  $("#quote").find("input:radio").click(function() {
    var i = $(this).val();
    if (window.set_line_item) {
      var label = $(this).parent().text();
      set_line_item("shipping", label.substr(0, label.indexOf(":")), Math.round($(this).parent().prev().val() * 100) / 100, 1, 1, false);
      if (window.getTax) {
        getTax();
      }
      else if (window.render_line_items) {
        render_line_items();
      }
    }
  }).end();

You could probably cut out most of the code in that anonymous function and replace it with what you need.

permalink #2 Mon, 11/17/2008 - 13:43
Lyle

Posts: 2357
 Joined: 08/07/2007
AdministratoreLiTe!

This is a lot easier in Drupal 6, because you can then use Drupal.behaviors. By adding event functions to Drupal.behaviors, Drupal knows to reattach those callbacks to the page whenever elements are added or changed. Perhaps you can dig through drupal.js in Drupal 6 to see how it does this, and copy it on a small scale for your own use.

permalink #3 Mon, 11/17/2008 - 15:38
TR
Posts: 974
 Joined: 11/05/2007
Bug FinderFAQ ModeratorGetting busy with the Ubercode.

The root problem is that the DOM is changed when the shipping quotes AJAX call is made. So any selectors that look for returned shipping methods won't find anything until after the AJAX call has returned. The jQuery code you added is executed when the page is loaded, so it doesn't have access to the shipping methods and can't attached to the radio buttons because those don't exist yet.

The Live Query jQuery plugin gives you a way to trigger actions on DOM modification. Or, you could modify us_quote.js to fire your selector when the AJAX call returns.

--

<tr>.

permalink #4 Fri, 11/21/2008 - 00:57
boregcz
Posts: 2
 Joined: 11/14/2008

Ok, thanx guys. I'll try to find out how to go about it, but i'm too busy of my work now :\ I'm not very good in jquery or programming generally. My job is information architecture, usability etc., so it'll take long time until i solve it cause i need to learn a lot about these things.

I'll then give a report how i coped with it.