CODEWITHSUNDEEP
javascriptjqueryhtml
Brian
Brian

Reputation: 81

Disable or hide select option if keyword is present in other element

Using jQuery, I want to hide or disable a select option if a keyword is present in an element higher up the page. Here's some example HTML:

<div>

    <div id="divID">The word EXAMPLE is in this sentence.</div>

    <select id="optionList" name="optionList">
        <option value="">Select Option</option>
        <option value="1">First option</option>
        <option value="2">Second option</option>
        <option value="3">Third option</option>
    </select>

</div>

So the psuedo-code would go something like this:

IF the word "example" is present in the div with ID "divID"...

THEN make select option "Third Option" hidden (or inactive, or otherwise not an option for the user).

OTHERWISE leave all the select options alone.

I imagine this is pretty basic stuff for anyone who knows what they're doing, which I clearly do not.

Thanks in advance for any help!

Upvotes: 0

Views: 291

Answers (2)

Ahmed Eid
Ahmed Eid

Reputation: 1183

check this js fiddle https://jsfiddle.net/pe1yvucj/ notice this line

$("option[value='3']").attr('disabled','disabled')

to make it enabled again

$("option[value='3']").removeAttr('disabled')

Upvotes: 0

leo.fcx
leo.fcx

Reputation: 6467

Using jquery plus regular expressions, following should be a basic sample:

$(document).ready(function() {
    if (/EXAMPLE/.test($('#divID').text()))
        $('option[value="3"]').hide();
});

Upvotes: 1

Related Questions