CODEWITHSUNDEEP
javascriptjquery
Cristian Boariu
Cristian Boariu

Reputation: 9621

Why my select onchange is not working?

I have this code:

            <select>
                <option onChange="filterProducts(this);">Select ...</option>
                <option onChange="filterProducts(this);">Samsung</option>
                <option onChange="filterProducts(this);">LG</option>
                <option onChange="filterProducts(this);">Sony</option>
                <option onChange="filterProducts(this);">Philips</option>
            </select>

Which should fire a js method but it simply does not fire:

function filterProducts(firedByControl){
   alert(fired);
}

For this button, calling the same js method, all works nice:

<button type="button" class="btn" onclick="filterProducts(this)" value="LCD">LCD</button>

Can you please tell me where I am wrong?

Upvotes: 1

Views: 410

Answers (5)

blue112
blue112

Reputation: 56432

You need to place the onchange attribute on the select, not on the option.

By the way, you should probably do something like that using JQuery :

$("select").onChange(filterProducts);

Upvotes: 1

Anton
Anton

Reputation: 32581

do this instead <select onchange="filterProducts(this);">

Upvotes: 1

matt b
matt b

Reputation: 139921

I believe that onchange should be an attribute of the <select> element, not each <option>.

Upvotes: 1

Selvakumar Arumugam
Selvakumar Arumugam

Reputation: 79830

Move the onchange to the select like below,

<select onchange="filterProducts">

Upvotes: 1

VVV
VVV

Reputation: 7593

You need to put the onchange call on the element.

 <select onChange="filterProducts(...);">
            <option>Select ...</option>
            <option>Samsung</option>
            <option>LG</option>
            <option>Sony</option>
            <option>Philips</option>
 </select>

Upvotes: 3

Related Questions