Price update on select / dropdown option change

Hello there,

I have 1 dropdown and 3 products field.
On dropdown option change, I need to update 3 products fields price.

Should I use JQuery OR SOME special hook (action / filter) ?

With this code (jquery) all goes fine, I change the option into the dropdown and it display the good information but after form update, it raise a “enter a valid value” and the dropdown doesn’t react : price of products field aren’t updating anymore :frowning:

I looked into Chrome console before submitting, all value update just fine and after submitting there are no error.

<script>
jQuery(document).ready(function($) {

var prix = [
    [14.95, 8.95, 5.95],
    ['$ 17.95 CAD', '$ 11.95 CAD', '$ 8.95 CAD'],
    [17.95, 11.95, 8.95],
    
    [21.95, 16.95, 6.95],
    [23.95, 16.95, 6.95],
    [25.95, 16.95, 6.95],
    
    [26.50, 16.95, 6.95],
    [28.50, 16.95, 6.95],
    [29.95, 16.95, 6.95]
];

$("#input_1_43").change(function() {
    var index = $(this).prop('selectedIndex');
    $("#ginput_base_price_1_44").val(prix[index-1][0]);
    $("#input_1_44").text(prix[index-1][0]);
    
    $("#ginput_base_price_1_46").val(prix[index-1][1]);
    $("#input_1_46").text(prix[index-1][1]);
    
    $("#ginput_base_price_1_47").val(prix[index-1][2]);
    $("#input_1_47").text(prix[index-1][2]);
    
});

});
</script>

Thank you for your help.