phpjavascriptspry

Activate/deactivate spry validation on selectbox options


I'm trying to get spry to activate/deactivate validation depending on what was selected in a select box.

It's optional to add an address, if an address is selected the country & region fields are shown and the spry_country, spry_region will need validating.

A price is optional, if a price is added the price & price tax fields are shown and the spry_price & spry_price_tax will need validating and so on.

I have the following code which seems to work fine but, if you select address then change your mind and then decide not to enter an address the code will hide the fields but seems to still try and validate the hidden fields as I cannot submit the form. Hope this makes sense :)

/* If address selected */
$("#location_option").change(function() {
    if ($("#location_option").val() == "address"){
        $(".show_location").show();
        /* activate spry */
        var spryselect4 = new Spry.Widget.ValidationSelect("spry_country", {isRequired:true});
        var spryselect5 = new Spry.Widget.ValidationSelect("spry_region", {isRequired:true});
    }
    else{
        $(".show_location").hide();
        var spryselect4 = new Spry.Widget.ValidationSelect("spry_country", {isRequired:false});
        var spryselect5 = new Spry.Widget.ValidationSelect("spry_region", {isRequired:false});
    }
});
$("#location_option").change();

/* If price selected */
$("#price_option").change(function() {
    if ($("#price_option").val() == "price"){
        $(".show_price").show();
        /* activate spry */
        var sprytextfield2 = new Spry.Widget.ValidationTextField("spry_price", "none", {isRequired:true});
        var spryselect7 = new Spry.Widget.ValidationSelect("spry_price_tax", {isRequired:true});
    }
    else{ 
        $(".show_price").hide();
        var sprytextfield2 = new Spry.Widget.ValidationTextField("spry_price", "none", {isRequired:false});
        var spryselect7 = new Spry.Widget.ValidationSelect("spry_price_tax", {isRequired:false});
    }
});
$("#price_option").change();

/* If date selected */
$("#date_option").change(function() {
    if ($("#date_option").val() == "date"){
        $(".show_date").show();
        /* activate spry */
        var sprytextfield3 = new Spry.Widget.ValidationTextField("spry_start_date", "none", {isRequired:true});
        var sprytextfield4 = new Spry.Widget.ValidationTextField("spry_finish_date", "none", {isRequired:true});
    }
    else{ 
        $(".show_date").hide();
        var sprytextfield3 = new Spry.Widget.ValidationTextField("spry_start_date", "none", {isRequired:false});
        var sprytextfield4 = new Spry.Widget.ValidationTextField("spry_finish_date", "none", {isRequired:false});
    }
});
$("#date_option").change();

Solution

  • I have sorted it by using:

    spryselect4 = new Spry.Widget.Utils.destroyWidgets("spry_country");