wildcard in jQuery comparison

Question

I am aware of this post, but .endsWith doesn't seem to resolve it, as it has to contain .val in order to work for dropdown. I am dealing with multiple languages for different dropdowns, where the word "English" appears in different translations. indexof > 0 is not pracitcal with so many languages.

If it is a duplicate, please point out for me where to look at, so I can carry on. Thanks!

I have the following jQuery comparison for dropdown values:

$(".languages").change(function () {
    if ($(".languages").val() == "English (UK)"||$(".languages").val() == "English (US)") {
        $(".selected-1").show();
        $(".unselected-1").hide();
    }
    else $(".unselected-2").show() && $(".unselected-1").hide();
});

Due to the fact that I deal with multiple different languages for the word "English", I am looking for a wildcard in this case. So why is the following not possible, or how do I optimize this?

$(".languages").change(function () {
    if ($(".languages").val() == "* (UK)"||$(".languages").val() == "* (US)") {
        $(".selected-1").show();
        $(".unselected-1").hide();
    }
    else $(".unselected-2").show() && $(".unselected-1").hide();
});

CertainPerformance · Accepted Answer · 2018-09-03T22:23:43.297

You can use a regular expression to see if it starts with "English" and ends with (US) or (UK):

const val = $(".language").val();
if (/^English \(U[SK]\)$/.test(val)) console.log('Pass');
else console.log('Fail');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="language" value="English (UK)">

If you just want to test whether a string ends with (US) or (UK), just leave off the first part of the regular expression:

const validate = str => /\(U[SK]\)$/.test(str);
console.log(validate('something (US)'));
console.log(validate('something (UK)'));
console.log(validate('something (UN)'));

Integrating that into your new code:

const $selected1 = $(".selected-1");
const $unselected1 = $(".unselected-1");
$(".languages").change(function() {
  if (/\(U[SK]\)$/.test($(this).val())) {
    $(".selected-1").show();
    $(".unselected-1").hide();
  } else {
    $(".unselected-2").show()
    $(".unselected-1").hide();
  }
});

You can also use endsWith as you were considering originally, though it's a bit less concise:

const $selected1 = $(".selected-1");
const $unselected1 = $(".unselected-1");
$(".languages").change(function() {
  const val = $(this).val();
  if (val.endsWith('(UK)') || val.endsWith('(US)')) {
    $(".selected-1").show();
    $(".unselected-1").hide();
  } else {
    $(".unselected-2").show()
    $(".unselected-1").hide();
  }
});

Thank you, however, in this case I still deal that when, for example, on the Spanish page the exact same dropdown contains "Inglés (UK)". The word "English" doesn't exist here. Or should I use `if ($U[SK]$$/.test(val))` — Demian, Sep 03 '18 at 21:59
Like the second part of the answer says, if you just want to test whether a string ends with `(US)` or `(UK)`, use `/$U[SK]$$/`. You do need the forward slashes at the beginning and at the end of the RE, those are its delimiters - the syntax will be invalid otherwise. — CertainPerformance, Sep 03 '18 at 22:06
I think I have to give the entire code, as I don't see how I can implement it. Sorry for not doing this at the first place, see updated question. — Demian, Sep 03 '18 at 22:14
I'm not understanding what the problem is, can't you just test against the retrieved value? — CertainPerformance, Sep 03 '18 at 22:22

wildcard in jQuery comparison

1 Answers1