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(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">