这是我的代码:
<section class="panel">
<header class="panel-heading">
<a data-toggle="modal" data-target="#modal_edit" onclick="modal_edit('<?php echo base_url() ?>leave/save')" class="btn btn-default pull-right" href=""><i class="fa fa-calendar-minus-o"></i> Add Leave</a>
<!-- <a class="btn btn-default pull-right" href="<?php echo base_url() ?>leave/apply_leave"><i class="fa fa-calendar-minus-o"></i> Appsssly Leave</a> -->
<h2 class="panel-title">Employee Leave History</h2>
</header>
<div class="panel-body">
<table class="table table-bordered table-striped mb-none" id="datatable-tabletools" data-swf-path="assets/vendor/jquery-datatables/extras/TableTools/swf/copy_csv_xls_pdf.swf">
<thead>
<tr>
<th>#</th>
<th>Employee Name</th>
<th>Leave Type </th>
<th>Subject</th>
<th class="hidden-phone">From date - To date</th>
<th class="hidden-phone">Reason</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php $count = 1 ?>
<?php foreach ($leave as $leave): ?>
<tr class="gradeX">
<td><?php echo $count++ ?></td>
<td id="name"><?php echo $leave->first_name . ' ' . $leave->last_name ?>
<input type="button" id="employee_id" value="<?php echo $leave->employee_id ?>"/>
</td>
<td><?php echo $leave->name ?></td>
<td><?php echo $leave->subject ?></td>
<td><?php echo $leave->from_date . ' - ' . $leave->to_date ?></td>
<td><?php echo $leave->reason ?></td>
<td>
<select id="status" data-plugin-selectTwo class="form-control populate placeholder" >
<option value="Pending">Pending</option>
<option value="Granted">Granted</option>
<option value="Rejected">Rejected</option>
</select>
</td>
</tr>
<?php endforeach; ?>
<!-- //onchange="update_status('<?php echo base_url().'status/leave/'.$employee_id ?>')" onchange="myFunction();" -->
</tbody>
</table>
</div>
<div>
</div>
</section>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$("#status").ready(function () {
$(this).change(function () {
//var y =$('#status').val();
//alert($('#status option:selected').val() );
//alert($("#status").select());
// var x = $('#employee_id').val();
// alert(this.x)
console.log(1);
$.ajax({
url :'<?php echo base_url() ?>leave/status',
data : {
status : $(this).val(),
employee_id : $('#employee_id').val(),
// name : $('#name').val(),
},
dataType: 'json',
success : function(response) {
alert(response);
}
});
});
});
</script>
我有foreach循环,并且有一个包含值的下拉列表。如果我有4个循环,那么我想只更新第一个循环的叶子,意味着id = 1
,使用ajax
它完美地工作。
现在我想更新id = 2但是问题是,jquery
没有得到id = 2
值,它选择第一个id值表示id =1
。
现在我想更新id = 2
以更新他们的请假。
答案 0 :(得分:0)
您不能多次使用相同的ID。 首先更改你的HTML
<?php foreach ($leave as $leave): ?>
<tr class="gradeX">
<td><?php echo $count++ ?></td>
<td id="name"><?php echo $leave->first_name . ' ' . $leave->last_name ?>
<input type="button" class="employee_id" value="<?php echo $leave->employee_id ?>"/>
</td>
<td><?php echo $leave->name ?></td>
<td><?php echo $leave->subject ?></td>
<td><?php echo $leave->from_date . ' - ' . $leave->to_date ?></td>
<td><?php echo $leave->reason ?></td>
<td>
<select id="<?php echo $leave->employee_id ?>" class="status" data-plugin-selectTwo class="form-control populate placeholder" >
<option value="Pending">Pending</option>
<option value="Granted">Granted</option>
<option value="Rejected">Rejected</option>
</select>
</td>
</tr>
<?php endforeach; ?>
在Javascript中:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".status").change(function () {
var employee_id = $(this).prop('id');
var status = $(this).val();
$.ajax({
url :'<?php echo base_url() ?>leave/status',
data : {'status' : status, 'employee_id' : employee_id},
dataType: 'json',
success : function(response) {
alert(response);
}
});
});
});
</script>
我希望这能解决你的问题。