2016-04-22 41 views
0

我有一個靜態的一行的表,並有儘可能多的行添加按鈕。但問題是在靜態行我可以通過使用div id輕鬆調用ajax函數,但我不能調用附加行中的ajax 。我怎樣才能解決這個問題?下面是附加的行表如何在追加表格行時調用ajax?

jQuery(function(){ 
     var counter = 1; 
     var count = 0; 
     jQuery('a.add-row').click(function(event){ 
      event.preventDefault(); 
      counter++; 
      count++; 
      var newRow = jQuery('<tr><td><label type="text" />'+ counter +'</td><td><select name="client_name[]" class="client_id" ><option value="">Select Client Name</option><?php foreach ($client as $client_name) { 
        echo '<option value="' . $client_name->client_id. '">' . $client_name->client_name . '</option>'; 
       }?></select></td><td><select name="order_id[]" class="order_id"></select></td><td><input type="text" name="item[]' + 
       '"/></td><td><input type="text" name="color[]' + 
       '"/></td>' + 
       '<td><input type="checkbox" name="knitting['+ count +'][]" value="0"></td>' + 
       '<td><input type="checkbox" name="mending['+ count +'][]" value="1"></td>' + 
       '<td><input type="checkbox" name="dyeing['+ count +'][]" value="2"></td>' + 
       '<td><input type="checkbox" name="iron['+ count +'][]" value="3"></td>' + 
       '<td><input type="checkbox" name="linking['+ count +'][]" value="4"></td>' + 
       '<td><input type="checkbox" name="mending['+ count +'][]" value="5"></td>' + 
       '<td><input type="checkbox" name="iron['+ count +'][]" value="6"></td>' + 
       '<td><input type="checkbox" name="packing['+ count +'][]" value="7"></td>' + 
       '<td><input type="checkbox" name="data['+ count +'][]" value="8"></td>' + 
       '<td><input type="checkbox" name="chalan['+ count +'][]" value="9"></td></tr>'); 
      jQuery('table.data_table').append(newRow); 
     }); 
    }); 

我的Ajax代碼的代碼:

$(".client_id").on('change', function (e) { 
      e.preventDefault(); 
      var client_id = $(this).val(); 
      $.ajax({ 
       url: '<?php echo base_url('followUp_controller/getOrder_byClient'); ?>', 
       type: 'POST', 
       data: 'client_id=' + client_id, 
       dataType: 'json', 
       success: function (response) { 
        // console.log(response); 
//     console.log('group district'); 
        var items = '<option value="">Select Order No</option>'; 
        $.each(response, function (index, value) { 
         items += "<option value='" + value.order_id + "'>" + value.order_no+ "</option>"; 
        }); 
        $(".order_id").html(items); 

       } 
      }); 
     }); 
+0

當你想打電話給阿賈克斯? –

+0

更改客戶端名稱 – Xravn

+0

這是不是很清楚你問的是什麼 –

回答

1

就拿點擊CLIENT_NAME的事件:

$(document).on('change', '.client_id', function(){ 
    // call ajax inside it 
    $.ajax({ 
     url: "/form.php", 
     type: "post", 
     data: data 
    }); 

}); 
+0

更改請ajax請參閱上面的阿賈克斯代碼 – Xravn

+0

爲chnage事件的動態添加html您需要使用$(document).on('change','.client_id',function(){... –

+0

只適用於一個附加行 但不爲其他行工作,因爲來自ajax的數據在其他行相同 – Xravn