-1

with on click event i returned the below drop down element as ajax json response, without page refresh:

<select class='custom-select col-md-4' id='family'>
  <option value''> Select family</option>
  <option value='1'>familyName</option>
</select>

then I want to execute a function when changed the option using:

$('#family').on('change', function(){
        alert("Yeey");
 });

but doesn't seem to be working.

El Capitan
  • 1
  • 1
  • Check the console for any errors occur – Siva Aug 07 '20 at 06:32
  • You may need to update the DOM with dynamically-inserted elements: https://stackoverflow.com/questions/17561243/jquery-selecting-dynamically-created-elements-and-pushing-to-firebase – Hektor Aug 07 '20 at 12:03

2 Answers2

0

Your code seems to be working. Just add one more option in select

For now, you have only one option which is by default selected so no change event applied. your script is good. example:

<select class='custom-select col-md-4' id='family'>
 <option value=''>select family</option>
  <option value='1'>familyName</option>
</select>
BukhariBaBa
  • 171
  • 5
  • I have a number of options. but still doesn't seem to be working – El Capitan Aug 07 '20 at 06:03
  • Did you added the jquery lib? Hope you did not miss to include this file. – BukhariBaBa Aug 07 '20 at 06:34
  • Yes I did, in fact I'm using the same function with another select element in the same Modal, but the difference is that this one is ajax returned DOM and the other one is part of the page html structure – El Capitan Aug 07 '20 at 06:40
  • OKay, If its Ajax return then you have to add onchange function in HTML element, like: – BukhariBaBa Aug 07 '20 at 06:43
0

Needs more than 1 option. By default, the first option is selected. So there's no on change event triggering.

Mari Nela De Leon
  • 21
  • 2