Country and State picklist value Java script

[Anonymous]

We have implemented form were when US is selected the State Filed appears with US state values, likewise for Australia also, but the problem here is we are using ISO codes for State. We have State pick list as Western Australia::WA (Australia) and Washington::WA (USA) , how can we compare these values to show WA Values as in Washington when USA is selected in country . Form 2.0 can solve this problem but we are using the older form and need this to be fixed in older one. The code we used is

if (jQuery(this).attr("text") == "Washington") {
          jQuery(this).attr("rel","United States");
        } else {
          jQuery(this).attr("rel","Australia");
        }
        break;
But it doesn't seem to work, would be great if you guys can help me with this.
 
Thanks,
CK

 

[Anonymous]

It's a hard to say what the problem is without seeing what the rest of the code on the page looks like. This piece of code itself looks like it's OK, but all it's doing is setting the "rel" attribute for "this" based on whether the text attribute is "Washington." This piece of code alone isn't going to do what you need. If you post more of your code people might be able to help you more. 

[Josh_Hill13]

Do you mean to display Washington to the user and WA to the system?

Should be able to do this in my Guide:
http://www.marketingrockstarguides.com

or maybe check my site for this.

[Anonymous]

Sorry for being late to respond, here is the full code.

jQuery(document).ready(function(){
   var stateOptions = {};

  // Get a reference to the state drop down (so we don't have to keep
  // finding it over and over again).
  var jState = jQuery( "#State" );

  //IE6 is acting weird with the width
  jState.css("width","205px");

  //put the rel on the state/province
  jQuery("#State option").each(function() {

    var optionVal = jQuery(this).attr("value");
    switch(optionVal)
    {
      case "ACT":
      case "NSW":
      case "QLD":
      case "SA":
      case "TAS":
      case "VIC":
        jQuery(this).attr("rel","Australia");
        break;

          // need to distinguish between CA and US "NT" state code
      case "NT":
        if (jQuery(this).attr("text") == "Northwest Territories") {
          jQuery(this).attr("rel","Canada");
        } else {
          jQuery(this).attr("rel","Australia");
        }
        break;

          // need to distinguish between AUS and US "WA" state code
      case "WA":
        if (jQuery(this).attr("text") == "Washington") {
          jQuery(this).attr("rel","United States");
        } else {
          jQuery(this).attr("rel","Australia");
        }
        break;

      case "SelectProvinceAU":
        jQuery(this).attr("rel","Australia").attr("value","");
        break;

      case "AB":
      case "BC":
      case "MB":
      case "NB":
      case "NF":
      case "NT":
      case "NS":
      case "NU":
      case "ON":
      case "PE":
      case "QC":
      case "SK":
      case "YT":
        jQuery(this).attr("rel","Canada");
        break;

      case "SelectProvince":
        jQuery(this).attr("rel","Canada").attr("value","");
        break;

      case "SelectState":
        jQuery(this).attr("rel","United States").attr("value","");
        break;

      case "":
        break;

      default:
        jQuery(this).attr("rel","United States");
    }
  });


  // Loop over each country and create an entry in the state options cache.
  jQuery( "#Project_Country__c" ).find( "option" ).each(
    function( index, option ){

      // Check to see that this option value has a length.
      // We can only create a key based on a valid value.
      if (option.value.length){

        // Create a cache for the state-based options. This will
        // be a jQuery collection of all the state options that should
        // be displayed if this country is selected.
        stateOptions[ option.value ] = jState.find( "option[ rel = '" + option.value + "' ]");
      }
    }
  );

  // This is a function that will update the options in the state-baesd
  // select box, based on the values in the country box.
  var updateStateList = function( countryCode ){
    // No matter what we do, we have to clear the state list first.
    jState.empty();

    // Now that we have an empty state list, let's see if we can repopulate
    // it with values from our state / country cache.
    if (countryCode.length && stateOptions[ countryCode ]){

      // Add the jQuery collection that we have cached at this country code.
      jState.append( stateOptions[ countryCode ] );

      // Select the first item in list.

      setTimeout(function () {
        jQuery("#State option:first").attr("selected",true);
        //var thisJState = jQuery( "#State" );
        //thisJState.get(0).selectedIndex = 0;
        }, 50);
    }
  }

  jQuery("#Project_Country__c").change(function()  {
    var selected = this.options[this.selectedIndex].value;
    var stateRow = jQuery("#State").parents("li:first");

    switch(selected)
    {
      case "United States":
        jState.addClass("mktFReq");
        stateRow.addClass("mktFormReq").slideDown().find("label").html("State:");

        // Update the state list.
        updateStateList( this.value );

        break;

      case "Canada":
        jState.addClass("mktFReq");
        stateRow.addClass("mktFormReq").slideDown().find("label").html("Province:");

        // Update the state list.
        updateStateList( this.value );

        break;

      case "Australia":
        jState.addClass("mktFReq");
        stateRow.addClass("mktFormReq").slideDown().find("label").html("State:");

        // Update the state list.
        updateStateList( this.value );

        break;

      default:
        stateRow.removeClass("mktFormReq").slideUp();
        jState.removeClass("mktFReq");

        // Update the state list.
        updateStateList( this.value );
    }
  }).change();

  // pre-fill state/province since we just manipulated that select list.
  setTimeout(function () {
    if ((typeof mktoPreFillFields != 'undefined') && (mktoPreFillFields) && mktoPreFillFields['State']) {
      var jStateOption = jQuery('#State option[value="' + mktoPreFillFields['State'] + '"]');
      if (jStateOption.val()) {
        jStateOption.attr('selected',true);
      }
    }
  }, 50);
});

Thanks,
CK