CODEWITHSUNDEEP
javascriptjquery
Austin
Austin

Reputation: 3080

JQuery converting "option:contains" into an exact string value

Right now I am getting a select option's value (literal value attribute) from JQuery, the problem is that it takes the first value it finds that simply "contains" that keyword.

For example, if I had a select with two options: Silver Division (value=1) and Silver (value=2), if I called the following line of code it would return (value=1) rather than (value=2)

var ranking = "Silver"; // hard-coded for example
var setIndex = $("#userElo" +" > option:contains(" + ranking + ")").val();

Q: I have been trying to search, with no success, for something like option:equals so that it only looks for exact string matches. I have tried various test-and-guess things like the following.

var setIndex = $("#userElo" + ID + " > option:contains" + ranking).val();
var setIndex = $("#userElo" + ID + " > option[text=" + ranking + "]").val();
var setIndex = $("#userElo" + ID + " > option[text=" + ranking).val();

Here is a JSFiddle Demo on a simple scale showing the Silver Division and Silver issue.

I am running out of ideas though, so if anyone know of some syntax for this solution that'd be awesome!

Thanks!

Upvotes: 1

Views: 51

Answers (1)

Anthony Grist
Anthony Grist

Reputation: 38345

You'll need to select all of the options that may potentially match, then use the filter() function to narrow them down to those that do actually match the text you want. This should do it:

var ranking = "Silver";
var setIndex = $("#userElo > option").filter(function() {
    return $(this).text() === ranking;
}).val();

Upvotes: 1

Related Questions