jqueryのAjaxの成功のドロップダウンリスト値の変更が、テキストボックスが

Question

を変更しない。これは場所のための私のドロップダウンリストで、これは私のgetDayPrice機能である特定の場所

$('#my_location').change(function() { 
     //updated 
     var val = parseInt($(this).find('option:selected').val()); 

     getDayPrice(val); 
    }); 

の価格のための別のドロップダウンリストを更新します

function getDayPrice(my_id) 
    { 

     $.ajax({ 
      type: "POST", 
      url: "getvalue.php", 
      data: { id: my_id }, 
      dataType: "text", 
      success: function(data) { 
       $('#my_duration').empty(); 
       $('#my_duration').append(data); 
       console.log(data); 

       $('#txt_my_duration').val(Date.now()); 
       $('#txt_my_cost').val(Date.now()); 
      }, 
      error: function() { 
       alert('error handing here'); 
      } 
     }); 
    } 

期間のドロップダウンリストは、#my_locationに関係なく更新されます。ただし、2つのテキストボックスは最初の項目のみを更新しました。

これは場所

<select class="form-control" id="my_location" name="my_location"> 
<option value="1">My Home</option> 
<option value="2">My Office</option> 
<option value="3">My Playground</option> 
<option value="4">My garage</option> 
<option value="5">My Bathroom</option> 
</select> 

<input type="text" name="txt_my_duration" id="txt_my_duration" value="" /> 
<input type="text" name="txt_my_cost" id="txt_my_cost" value="" /> 

初期はMy Homeに選択され、私はMy Officeに変更した場合の価格ドロップダウンリストがドロップダウンリストには、正しい、正しいですが、2つのテキストボックスが更新されなかった例です。 My Homeに戻ると、価格ドロップダウンリストが正しくなり、テキストボックスが更新されます。

なぜそれが唯一の最初のオプションのために働きますか？

UPDATE

私はAJAXをスキップする場合、2つのテキストボックスには関係なく、私が選択したDropDownListコントロールされ、更新されなくなります。

function getDayPrice(my_id) 
    { 

     data = "<option value="3">My Playground</option>"; 
       $('#my_duration').empty(); 
       $('#my_duration').append(data); 
       console.log(data); 


       var matches = data.match(/value='([^])'/i); 
       var content = data.match(/>([^s]+)<\/option>/i); 
       console.log(matches[1]); 

       console.log(content[1]); 
       //$('#txt_my_duration').val(matches[1]); 
       //$('#txt_my_cost').val(content[1]); 
       $('#txt_my_duration').val(Date.now()); 
       $('#txt_my_cost').val(Date.now()); 
    } 

接続されたコンソールログ

XHR finished loading: POST "http://localhost/getvalue.php".send @ jquery.min.js:5 
getvalue.php:756 <option value='1'>My Home</option> 
getvalue.php:760 1473924849426 
getvalue.php:764 1473924849426 

XHR finished loading: POST "http://localhost/getvalue.php".send @ jquery.min.js:5 
getvalue.php:756 <option value='2'>My Office</option> 
getvalue.php:760 Uncaught TypeError: Cannot read property '1' of nullsuccess @ getvalue.php:760c @ jquery.min.js:3fireWith @ jquery.min.js:3k @ jquery.min.js:5r @ jquery.min.js:5 
jquery.min.js:5 

XHR finished loading: POST "http://localhost/getvalue.php".send @ jquery.min.js:5 
getvalue.php:756 <option value='1'>My Home</option> 
getvalue.php:760 1473924849436 
getvalue.php:764 1473924849436 

Answer 1

var val = parseInt($(this).find('option:selected').val()); 

ノート選択した値を取得する：あなたは、同じIDを持つ複数の選択を持っている場合は、値のvillが最初に選択の値であること試合は、オプションの値であり、コンテンツはテキストは次の操作を行うと仮定すると、そのID

var matches = $(data).val(); 
var content = $(data).text(); 
$('#txt_my_duration').val(matches); 
$('#txt_my_cost').val(content); 

Answer 2

オプションがドロップダウンリストに動的に読み込まれているようです。もしそうなら、あなたは

$('body').on('change', '#my_location', function() { 
    // Do your stuff 
}