0

Im trying to get the value thats in a select box and change the input of another field frontend

as you can see the mask is _- in the zip code input

If i choose Portugal i want my mask to be like 9999-999 and if its another country to be empty or other format

this is the code

if ($("input[name='postcode']").length) {
            $("input[name='postcode']").inputmask({"mask": "9999-999"});
        } else if ($("input=[name='postcode']").length && $("option=[value='PT']")) {
            $("input[name='postcode']").inputmask({"mask": "99999-99999"});
        }

How can i achieve that?

PS: im doing this on Magento

This is the select code

<select class="select" data-bind="
attr: {
    name: inputName,
    id: uid,
    disabled: disabled,
    'aria-describedby': getDescriptionId(),
    'aria-required': required,
    'aria-invalid': error() ? true : 'false',
    placeholder: placeholder
},
hasFocus: focused,
optgroup: options,
value: value,
optionsCaption: caption,
optionsValue: 'value',
optionsText: 'label',
optionsAfterRender: function(option, item) {
    if (item && item.disabled) {
        ko.applyBindingsToNode(option, {attr: {disabled: true}}, item);
    }
}"name="country_id" id="CV73BUT" aria-required="true" aria-invalid="false">

and this is the Postal code

<input class="input-text" type="text" data-bind="
value: value,
valueUpdate: 'keyup',
hasFocus: focused,
attr: {
    name: inputName,
    placeholder: placeholder,
    'aria-describedby': getDescriptionId(),
    'aria-required': required,
    'aria-invalid': error() ? true : 'false',
    id: uid,
    disabled: disabled

}" name="postcode" aria-required="true" aria-invalid="false" id="J5KT615">

the ids of select and input are always changing after refresh

Francisco Fernandes
  • 1
  • 2
  • https://stackoverflow.com/a/2780584/2181514 Value of a `select` in jquery is `$("#id_of_select").val()` Can't quite see how that relates to the rest of your question, so not a "full" answer. – freedomn-m Jul 12 '21 at 15:18
  • Note, with jquery, you don't need to check if an element exists first; jquery will apply to all matching elements or none. So no need for `if ($("#id").length) $("#id").show()` just use `$("#id").show()` - so your first `if` will always be true. (also note `$("input=[name...` is not a valid selector, I'm assuming you're trying something / looking to see how this would work – freedomn-m Jul 12 '21 at 15:22
  • @freedomn-m i edited the post with the code of the select and input. i dont know if it is more clear now. Cause in case a user selects Portugal i want the mask to be with the inputmask 9999-999 and if not will be 99-99 or something like that – Francisco Fernandes Jul 12 '21 at 15:58

1 Answers1

0

You can do something like this. See example below

$('#countrys').change(function(){
    var country = $('#countrys').find(':selected').attr('data-countryCode');
    if (country == 'pt')
    {
      $('#zipcode').val('999-999');
    }else{
      $('#zipcode').val('n/a');
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="countrys">
  <option data-countryCode="fr">france</option>
  <option data-countryCode="it">Italy<option>
  <option data-countryCode="pt">Portugal</option>
  <option data-countryCode="sp">Spain</option>
</select>

<input id="zipcode">
Alexis Garcia
  • 452
  • 3
  • 15
  • Thanks for the awnser man but i think that way my project is made i cannot use that. The way i get the countrys in my select is from Magento backoffice so i cannot "choose" hot the options appear. And the inputmask is really a function that allows the user to write the zip code in that conditions and format – Francisco Fernandes Jul 12 '21 at 16:20
  • You just have to add data-countryCode to your options you can do that in the backoffice you already did it with other options. You shud look for help in https://pt.stackoverflow.com/ you can express yourself better there. Boa sorte ;) – Alexis Garcia Jul 12 '21 at 16:24
  • thanks man. Yes maybe i can explain myself better in my language xd – Francisco Fernandes Jul 14 '21 at 14:03