Jquery not getting the selected value from dropdown

Question

I am trying to get the value of selected drop down,the selected value to store in database but it not takeing the selected value below is my code can one guide how to do it.thanks

Updated

clientnetworkpricelist/update.php

$dbHost = 'localhost'; // usually localhost
$dbUsername = 'xxx';
$dbPassword = 'xxxxxxxx';
$dbDatabase = 'fms';
$db = mysql_connect($dbHost, $dbUsername, $dbPassword) or die ("Unable to connect to Database Server.");
mysql_select_db ($dbDatabase, $db) or die ("Could not select database.");

$client_id=$_POST['clientid'];
    $feild=$_POST['field'];
            $data= $_POST['value'];
            $rownum=$_POST['rowid'];  
            $sql="UPDATE $client_id SET ".$feild." = '".$data."' WHERE net_id = ".$rownum."";

             print $sql;



            mysql_query($sql)

;  

Html

<?php
$client_id=$_GET['clientid'];

if($client_id!=""){

$sql=mysql_query("select * from supplierprice a JOIN $client_id b WHERE b.`net_id` = a.`supp_price_id`" );
$query = "SELECT route FROM routestable WHERE `clientid` = '$client_id' ";
$result = mysql_query($query);
//print "query". $query;

while($rows=mysql_fetch_array($sql))
{

if($alt == 1)
        {
           echo '<tr class="alt">';
           $alt = 0;
        }
        else
        {
           echo '<tr>';
           $alt = 1;
        }

echo '   <td  class=" '.$rows["net_id"].'">'.$rows["clientid"].'</td>
         <td id="CPH_GridView1_clientid" class=" '.$rows["net_id"].'">'.$rows["region"].'</td>  
        <td id="CPH_GridView1_country" class=" '.$rows["net_id"].'">'.$rows["country"].'</td>
        <td id="CPH_GridView1_networkname" class=" '.$rows["net_id"].'">'.$rows["networkname"].'</td>
        <td id="CPH_GridView1_mcc"  class=" '.$rows["net_id"].'">'.$rows["mcc"].'</td>   
        <td id="CPH_GridView1_mnc"  class="'.$rows["net_id"].'">'.$rows["mnc"].'</td>
        <td id="CPH_GridView1_mnp" class="edit mnp '.$rows["net_id"].'">'.$rows["mnp"].'</td>';
  /*                        
         $ColumnNames = mysql_query("SELECT column_name FROM information_schema.COLUMNS WHERE table_name = 'supplierprice' AND column_name NOT
IN ('supp_price_id','net_id','region', 'country', 'networkname', 'mcc', 'mnc', 'mnp'
)") or die("mysql error"); 

$columnArray=array();*/


foreach($columnArray as $value) {


//$columnArray[]=$rows1[0];

echo '<td  id="CPH_GridView1_xxx" width="0px;" class="edit '.$value.' '.$rows["net_id"].'">'.$rows[$value].'</td>';   
}   



 echo ' <td id="CPH_GridView1_clientprice" class="edit clientprice '.$rows["net_id"].'">'.$rows["clientprice"].'</td>
        <td> <select name="mySelect" id="mySelect" class="edit route '.$rows["net_id"].'" >';         



           // $query = "SELECT route FROM routestable WHERE `clientid` = '$client_id' `"; 
           // print "Query is".$query; 
            $result = mysql_query($query);
            while ($rows = mysql_fetch_assoc($result))  
            {  
                echo '<option value="' . $rows['route'] . '"> ' . $rows['route'] .     '</option>';  
               // echo '<option value="Hi"> Hi</option>';
            }   


         echo '</select>
                            </td>

                <td></td>'


        ;

echo '</tr>';

}
}
?>

ajax

$(document).ready(function(){ 
    $('#mySelect').on('change keyup', function(){
        arr = $(this).attr('class').split( " " );
        var clientid=document.getElementById("client").value;

        $.ajax({    type: "POST",
            url:"clientnetworkpricelist/update.php",
           data: "value="+$('#mySelect').find(":selected").val()+"&rowid="+arr[2]+"&field="+arr[1]+"&clientid="+clientid,
            success: function(data){
            $('.ajax').html($('.ajax input').val());
            $('.ajax').removeClass('ajax');
        }});
    });


    $('#editbox').live('blur',function(){
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
    });
});

Answer 1

$('.ajax input').val() is an issue here, please make sure you have an input element in your HTML.

If want to use mySelect value in post,

data: "value="+$(this).val()+"&rowid="+arr[2]+"&field="+arr[1]+"&clientid="+clientid,

And also here,

$('.ajax').html($('.ajax input').val());

In that case, you need to use edit class selector. ID is unique attribute, thats the reason, it was worked for first one element.

             $('.edit').on('keyup change', function(){              

                  arr = $(this).attr('class').split( " " );

                  var clientid=document.getElementById("client").value;

                    $.ajax({    type: "POST",
                        url:"clientnetworkpricelist/update.php",
                        data: "value="+$(this).val()+"&rowid="+arr[2]+"&field="+arr[1]+"&clientid="+clientid,
                        success: function(data){
                        $('.ajax').html($('.ajax input').val());
                        $('.ajax').removeClass('ajax');
                    }});
                });

Answer 2

You should get the value of selected option with following:

var value2send = $('#mySelect').find(":selected").val();

Then you could add it to your data.

UPDATE

Thanks to @charlietfl this is an another alternative:

var value2send = $('#mySelect').val();

Answer 3

为了使下拉菜单中的所选项目，无需使用CHange Action例如

var SlcItem = $('#Your Select').find('option:selected').attr('value');