Get selected value of a dropdown's using jquery php

Question

I have a drop down

  <div class="form-group">
 <select class="form-control" required name="uname" id="uname">
 <option value=""/>Select Your Name</option>
  <?php foreach ($this->getallusers as $users): ?>
 <option value="<?php echo $users['adminID'] ?>"<?= $users['adminID'] == $stories['Tm_id'] ? ' selected="selected"' : ''; ?>/><?php echo $users['UserName'] ?></option>
 <?php endforeach; ?>
</select>

Drop down have values.then when i am tried to get the selected drop down value from jquery.

var op=$('#uname option :selected').text(); 
 var opid=$('#uname option :selected').val(); alert(opid);

When i alert op (text) i always got Select Your Name and opid is always blank.but drop down i have values pakka.Any help would be Appreciated .

Answer 1

try to use just this code:

alert($("#uname").val());

////////

.val() - gets a value of any input and dropdown.

Answer 2

Try below code to get the currently selected value and text when select box is change.

$(document).ready(function(){
    $("select#uname").change(function(){
        var op = $(this).children("option:selected").text();
        var opid = $(this).children("option:selected").val();
        alert("You have selected - " + op + " -> " opid);
    });
});

Answer 3

Try removing the space from option and :selected on your jquery . So intead of

var op=$('#uname option :selected').text(); 
var opid=$('#uname option :selected').val(); alert(opid);

it should be

var op=$('#uname option:selected').text(); 
var opid=$('#uname option:selected').val(); alert(opid);