jqueryで追加された選択リストの値を取得する

Question

jqueryを使用して、追加された選択リストから選択した値を取得する方法を尋ねます。私を助けてください。前もって感謝します。

var wrapper1 = $(".column1"); 
 

 
array1 = ["sample1", "sample2", "sample3"]; 
 

 
var myRoot = window.location.origin + "/"; 
 
$.ajax({ 
 
    url: myRoot + 'Payslip/GetDataFromAppend', 
 
    type: 'GET', 
 
    contentType: "application/json; charset=utf-8", 
 
    //data: JSON.stringify({ id: $this }), 
 
    async: true, 
 
    success: function (data) { 
 

 
     $(wrapper1).append(appendOption(data, array1[0])); 
 

 
    } 
 
}); 
 

 
var appendOption = function (data, txtData) { 
 
    var appendfor = '<label class="col-sm-4 control-label"><label> ' + txtData + '...</label></label><div class="col-sm-7">' + 
 
     '<select class="form-control" asp-for="PayslipID" asp- items="ViewBag.PayslipID" data- val="true" data- val - required="The Payslip ID field is required." id= "PayslipID" >'; 
 
    for (var i = 0; i < data.length; i++) { 
 
     console.log(data[i].value); 
 
     appendfor += '<option value="' + data[i].value + '">' + data[i].value + '</option>'; 
 
    } 
 
    appendfor += '</select ></div >'; 
 
    return appendfor; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="form-group column1"></div>

Answer 1

「フォームコントロール」要素を使用すると、イベントの委任を使用する必要があるので、動的にページに追加され、これを試してみてください。

$(document).on('change', ".form-control", function(){ 
    alert($(this).val()) 
}); 

「column1の」も動作するはずです静的要素であると仮定して '文書'の代わりに使用します。