Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

63
Views
conflict between onchange events

I have a select dropdown for countries that supposed to change the values of checkboxes so it can be calculated on a Price summary before the user send it to us.

The issue that I have is that I am using 3 JavaScript codes for the select dropdown to do that 2 of them are working fine and they are:

Code to hide fields prices and show users based on the selected country

<script>
$(document).ready(function(){
    $("select").on('change', function(){
        $(this).find("option:selected").each(function(){
            var optionValue = $(this).attr("value");
            if(optionValue){
                $(".small").not("." + optionValue).hide();
                $("." + optionValue).show();
            } else{
                $(".small").hide();
            }
        });
    }).change();
});
</script>

Code to change the value to be calculated in the cost estimate form

<script>

$(document).ready(function() {
  var price = {
    "usa": {
      "value1": 33.00,
      "value2": 30.00,
      "value3": 24.00
    },
    "uae": {
      "value1": 33.00,
      "value2": 30.00,
      "value3": 24.00
    },
    "egypt": {
      "value1": 177,
      "value2": 310,
      "value3": 420
    }
  };
  function updatePrice() {
    var val1 = +$(".value1").val();
    var val2 = +$(".value2").val();
    var val3 = +$(".value3").val();
    var countryList = $("[name='countryList']").val();
    var one = val1 * price[countryList].value1;
    var two = val2 * price[countryList].value2;
    var three = val3 * price[countryList].value3;
    
    $("#price1").val(one);
    $("#extraOption1").val(one);
  }
  $(".input").on("keyup", updatePrice);
  $("[name='countryList']").on("change", updatePrice);

});
</script>

The above codes working fine but when i use the below code it work but it disabling the above 2 codes

// the code update the order summary on selecting the country
    $('#countryList').on('change', function () {
        showSelectedItemPrice('#countryList');
        updateSummary();
        saveState();
        reValidateTotal();
    });

I think the change events are disabling each others. please help me if there is a solution for it

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!