Codeigniter 3 ajax 使用 jquery 从另一个输入计算

Question

所以这个想法是操纵Ajax提供的值。此值应除以 20，结果应乘以 #nilai_hari 输入中的值。 这是我的代码

// trigger
<select class="form-control" id="id_anggota" name="id_anggota">
<option>-Pilih Karyawan</option>
<?php $no=1; foreach ($listAnggota as $l) {?>
<option value="<?php echo $l->id_anggota; ?>">
<?php echo $l->nama_lengkap; ?>
</option>
<?php $no++; }?>
</select>
// the effected
<select class="tunjangan_makan form-control total_tunjangan nominal" id="tunjangan_makan" name="tunjangan_makan"></select>
// another trigger
<input type="text" id="nilai_hari" name="nilai_hari" class="form-control">

这是脚本

$('#id_anggota').change(function() {
var id = $(this).val();
$.ajax({
url: "<?php echo base_url();?>hrd/penggajian/get_subpenggajian",
method: "POST",
data: {
id: id
},
async: false,
dataType: 'json',
success: function(data) {
var html = '';
var i;
for (i = 0; i < data.length; i++) {
if (data[i].flat_tunjangan == 1) {
html += '<option value="' + data[i].tunjangan_makan + '">' + number_format(data[i].tunjangan_makan, 0, '', '.') + '</option>';
} else {
$('#tunjangan_makan', '#nilai_hari').keyup(function() {
var nilai_hari = $("#nilai_hari").val(),
makan = ((data[i].tunjangan_makan / 20) * nilai_hari)
html += '<option value="' + makan + '">' + number_format(makan, 0, '', '.') + '</option>';
})
}
}
$('.tunjangan_makan').html(html);
}
});
});

因此，flat_tunjangan为 0 的数据值必须从另一个输入计算。提前致谢

Answer 1

你做错了。您应该调用其他输入 onkey 事件并再次调用相同的 ajax 请求，并在 $('#id_anggota'(.change(( 中删除该 onkey 事件。

$('#id_anggota').change(function(){
var id=$(this).val();

// perform ajax and get data
var data = [{'flat_tunjangan': '1', 'tunjangan_makan': '20'}, {'flat_tunjangan': '0', 'tunjangan_makan': '30'}];

var html = '';
var i;
for(i=0; i<data.length; i++){
if(data[i].flat_tunjangan == 1){
html += '<option value="'+data[i].tunjangan_makan+'">'+data[i].tunjangan_makan+'</option>';
} else {
var nilai_hari  = $("#nilai_hari").val(), 
makan = ((data[i].tunjangan_makan/20)*nilai_hari)
if (makan != '') {
html += '<option value="'+makan+'">'+makan+'</option>';
}
}
}
$('.tunjangan_makan').html(html);
});

$("#nilai_hari").keyup(function(){
var nilai_hari = $(this).val();

// again do ajax reqeust and fetch data using selected tunjangan_makan id
var id = $('#id_anggota').val();
var data = [{'flat_tunjangan': '1', 'tunjangan_makan': '20'}, {'flat_tunjangan': '0', 'tunjangan_makan': '30'}];

var html = '';
var i;
for(i=0; i<data.length; i++){
if(data[i].flat_tunjangan == 1){
html += '<option value="'+data[i].tunjangan_makan+'">'+data[i].tunjangan_makan+'</option>';
} else {
var nilai_hari  = $("#nilai_hari").val(), 
makan = ((data[i].tunjangan_makan/20)*nilai_hari)
if (makan != '') {
html += '<option value="'+makan+'">'+makan+'</option>';
}
}
}
$('.tunjangan_makan').html(html);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control" id="id_anggota" name="id_anggota">
<option value="1">Test 1</option>
<option value="2">Test 2</option>
</select>
<select class="tunjangan_makan form-control total_tunjangan nominal" id="tunjangan_makan" name="tunjangan_makan"></select>
<input type="text" id="nilai_hari" name="nilai_hari" class="form-control">