Display Just Canadian Provinces when Country Selected is Canada

[tammu]

I have added all the Canadian Provinces the State List and using jQuery I am displaying only Canadian Provinces when country Canada is Selected, and if US is selected only US states displayed and for any other country hide the Select box completely use the other state/provinces text box
But I am running into problem for example if a customer forgots to enter any other field in the OCST page and hit continue, when the page reloads, the state and country options selected resets.

Is there way to do this in Miva Merchant and Am I taking the wrong approach.

Thanks

<div class="&mvte:global:BillState_Row; stateselect">
                <label class="required" for="BillStateSelect"><span>* </span>State:</label>
                    <select name="BillStateSelect" id="BillStateSelect">
                    <option value="" class="us-states">Select State</option>
                    <mvt:if expr="g.BillStateSelect EQ 'AL'">
                    <option class="us-states" value="AL" selected>Alabama</option>
                    <mvt:else>
                    <option class="us-states" value="AL">Alabama</option>
                    </mvt:if>
                    <mvt:if expr="g.BillStateSelect EQ 'AK'">
                    <option class="us-states" value="AK" selected>Alaska</option>
                    <mvt:else>
                    <option class="us-states" value="AK">Alaska</option>
                    </mvt:if>
                    <mvt:if expr="g.BillStateSelect EQ 'AZ'">
                   <option class="us-states" value="AZ" selected>Arizona</option>
                   <mvt:else>
                    <option class="us-states" value="AZ">Arizona</option>
                   </mvt:if>
                    <option class="ca-states" value="">Select Province</option>
                    <mvt:if expr="g.BillStateSelect EQ 'AB'">
                    <option class="ca-states" value="AB" selected>Alberta</option>
                    <mvt:else>
                    <option class="ca-states" value="AB">Alberta</option>
                    </mvt:if>
                    <mvt:if expr="g.BillStateSelect EQ 'BC'">
                    <option class="ca-states" value="BC" selected>British Columbia</option>
                    <mvt:else>
                    <option class="ca-states" value="BC">British Columbia</option>
                    </mvt:if>
                    </select>
            </div>
            
            <div class="&mvte:global:BillState_Row; other-state">
                <label class="italic" for="BillState">Other State/Province:</label>
                <input type="text" name="BillState" id="BillState" value="&mvte:global:BillState;" class="textfield" />
            </div>
<script type="text/javascript">
$(document).ready(function($) {    
    $("#BillCountry").change(function() {
        var bcountry = $(this).val();
        if( bcountry=='CA') {
           $(".ca-states").show();    
           $(".us-states").hide();
        } else if(bcountry=='US') {
          $(".ca-states").hide();
          $(".us-state").show();
        } else {
          $(".stateselect").hide();
          $(".other-state").css("display", "block");
        }
    });
});
</script>

[tammu]

Re: Display Just Canadian Provinces when Country Selected is Canada

Ok I closed the question too early the states are still getting reset. Anyway to do this ... Appreciate it

[KNewbrough]

Re: Display Just Canadian Provinces when Country Selected is Canada

It's hard to say if it will play nicely with your script, but if you have Tool Kit you may be able to use the basketfiller function to allow OCST to remember the selections.

You may need to separate that function and give it a name which you can call both on window.load or document.ready, as well as on $("#BillCountry").change.

[tammu]

Re: Display Just Canadian Provinces when Country Selected is Canada

Hi Kyle,

Thanks for replying. I have already added the basketfiller function at the top of the OCST page. If I understand correctly, Should I remove it from there and include it JS function on windows.load

Thanks

[KNewbrough]

Re: Display Just Canadian Provinces when Country Selected is Canada

Oh sorry, my second comment was regarding a fallback if basketfiller doesn't do the job. I was referring to your JavaScript function.

Here's what I meant:

<script type="text/javascript">
$(function(){ 
    checkCountry();   
    $("#BillCountry").on('change',checkCountry);
    function checkCountry() {
      var bcountry = $("#BillCountry").val();
      if( bcountry=='CA') {
         $(".ca-states").show();    
         $(".us-states").hide();
      } else if(bcountry=='US') {
        $(".ca-states").hide();
        $(".us-state").show();
      } else {
        $(".stateselect").hide();
        $(".other-state").css("display", "block");
      }
    };
});
</script>

Let me know if that solves the problem.

[tammu]

Re: Display Just Canadian Provinces when Country Selected is Canada

Hi kyle,

Thanks for replying I got much further into the solution with your help, Now I am able successfully display Canadian Provinces when Canada is Selected and US States when US is selected.

But the when Country is not US or Canada I was still able to display the Other State/Province text box but once again if the user forgets something and hit continue button, It resets the Other State/Province text box.

I am thinking g.states_empty has something to do it. I am wondering if its possible to tweak that condition. I tried to use the token list and see whats available with g.states_empty.

Thanks and appreciate it