getting perticular listbox selected value using javascript

Question

I have html listbox as, which has same name but different id

<select name="dept"  id="vrow" >
                        <option selected="selected" > - Select Department- </option>
                        <option value="GEN">computer </option>
                        <option value="SC">mac </option>
                        <option value="ST">civ </option>
                        <option value="OBC">ele </option>
                      </select>

i had atteched it to each row fetched from database, how can i get ID if i change perticular listbox value.

you use ajax function for get results from server database

Vadivel S
– Vadivel S

2016-01-30 12:30:09 +00:00
Commented Jan 30, 2016 at 12:30 — Vadivel S
– Vadivel S, Commented Jan 30, 2016 at 12:30

user3164240 · Accepted Answer · 2016-01-30 12:37:47Z

1

If you need id then use:

document.getElementById('vrow').addEventListener('change', function(e) {
   if (e.target.name==='dept') {
     alert(e.target.id);
   }
})

Working Demo

If you need value then use:

document.getElementById('vrow').addEventListener('change', function(e){
   if (e.target.name==='dept') {
       alert(e.target.value);
   }
})

Working Demo

answered Jan 30, 2016 at 12:37

user3164240

Sign up to request clarification or add additional context in comments.

Comments

Vadivel S · Accepted Answer · 2016-01-30 12:43:33Z

0

You Write Javascript Function or Jquery function

like this

<select onchange="dept(this.value)" name="dept"  id="vrow" >
<option selected="selected" > - Select Department- </option>
<option value="GEN">computer </option>
<option value="SC">mac </option>
<option value="ST">civ </option>
<option value="OBC">ele </option>
</select>

<script type="text/javascript">
function dept(id){
$.ajax({
url: 'ajax.php',
data: { id: id} ,
success: function (response) {
try{
alert(response);
}
catch(e){
alert("Error"+e);
}
},
error: function (e) {
alert("error"+e); or alert("error"+JSON.stringify(e));
}
});
}
</script>

Ajax.php

answered Jan 30, 2016 at 12:43

Vadivel S

6608 silver badges15 bronze badges

Comments

Viktor Kukurba · Accepted Answer · 2016-01-30 12:54:58Z

0

You can add event listener on change event to parent node of all <select> elements it can ul if they are in list or even body.

<script type="text/javascript">
  document.getElementByTagName('UL').addEventListener('change', function(e) {
    if (e.target.name==='dept') {
      //In this case you have got element that you need and its id 
      //e.target.id
      alert(e.target.id);
    }
  });
</script>

edited Jan 30, 2016 at 12:54

answered Jan 30, 2016 at 12:31

Viktor Kukurba

1,3709 silver badges14 bronze badges

2 Comments

user2971724 Over a year ago

Will you please tell me what change i have to make in html listbox coding?

Viktor Kukurba Over a year ago

Insert that code before you close 'body' tag (</body>).

Collectives™ on Stack Overflow

getting perticular listbox selected value using javascript

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related