I have php code which generates a table. Inside td I have inserted img. When user click on td then it changes img inside it. But it is not working properly. Only even rows td element changes image while odd rows doesn't. Below is my code:
<div class="row" id="atten_list">
<div class="col-sm-offs-3 col-md1-6">
<table class="table table-bordered">
<thead>
<tr>
<td><?php echo get_phrase('roll');?></td>
<td><?php echo get_phrase('name');?></td>
<td><?php echo get_phrase('1');?></td>
<td><?php echo get_phrase('2');?></td>
<td><?php echo get_phrase('3');?></td>
<td><?php echo get_phrase('4');?></td>
<td><?php echo get_phrase('5');?></td>
<td><?php echo get_phrase('6');?></td>
<td><?php echo get_phrase('7');?></td>
<td><?php echo get_phrase('8');?></td>
<td><?php echo get_phrase('9');?></td>
<td><?php echo get_phrase('10');?></td>
<td><?php echo get_phrase('11');?></td>
<td><?php echo get_phrase('12');?></td>
<td><?php echo get_phrase('13');?></td>
<td><?php echo get_phrase('14');?></td>
<td><?php echo get_phrase('15');?></td>
<td><?php echo get_phrase('16');?></td>
<td><?php echo get_phrase('17');?></td>
<td><?php echo get_phrase('18');?></td>
<td><?php echo get_phrase('19');?></td>
<td><?php echo get_phrase('20');?></td>
<td><?php echo get_phrase('21');?></td>
<td><?php echo get_phrase('22');?></td>
<td><?php echo get_phrase('23');?></td>
<td><?php echo get_phrase('24');?></td>
<td><?php echo get_phrase('25');?></td>
<td><?php echo get_phrase('26');?></td>
<td><?php echo get_phrase('27');?></td>
<td><?php echo get_phrase('28');?></td>
<td><?php echo get_phrase('29');?></td>
<td><?php echo get_phrase('30');?></td>
<td><?php echo get_phrase('31');?></td>
</tr>
</thead>
<tbody>
<?php
$students = $this->db->get_where('student' , array('class_id'=>$class_id))->result_array();
foreach($students as $row):
?>
<tr class="gradeA" id="adata">
<td><?php echo $row['roll'];?></td>
<td><?php echo $row['name'];?></td>
<?php
for($i=1; $i<=31; $i++){ ?><?php
$datea = $i;
$full_date = $year.'-'.$month.'-'.$datea;
//inserting blank data for students attendance if unavailable
$verify_data = array( 'student_id' => $row['student_id'],
'date' => $full_date);
$query = $this->db->get_where('attendance' , $verify_data);
if($query->num_rows() < 1){
$this->db->insert('attendance' , $verify_data);}
//showing the attendance status editing option
$attendance = $this->db->get_where('attendance' , $verify_data)->row();
$status = $attendance->status;
$id = $attendance->attendance_id;
?>
<?php if ($status == 1):?>
<td align="center" id="status" title="<?php echo $id; ?>">
<img src="<?php echo base_url("/assets/images/present.png"); ?>" alt="StackOverflow" title="StackOverflow is the best!" />
</td>
<?php endif;?>
<?php if ($status == 2):?>
<td align="center" id="status" title="<?php echo $id; ?>">
<img src="<?php echo base_url("/assets/images/absent.png"); ?>" alt="StackOverflow" title="StackOverflow is the best!" />
</td>
<?php endif; ?><?php }?><?php $this->db->where('class_id',$class_id);
$this->db->from('student');
$nofs = $this->db->count_all_results(); ?>
<!-- Script for changing image on td click -->
<script>
$("table tbody tr#adata td#status").click(function() {
var img = $(this).find("img")[0];
if(img.src == '<?php echo base_url("/assets/images/present.png"); ?>'){
img.src = img.src.replace('<?php echo base_url("/assets/images/present.png"); ?>', '<?php echo base_url("/assets/images/absent.png"); ?>');
}
else if(img.src == '<?php echo base_url("/assets/images/absent.png"); ?>'){ img.src = img.src.replace('<?php echo base_url("/assets/images/absent.png"); ?>', '<?php echo base_url("/assets/images/present.png"); ?>');
}else{}
}); </script>
</tr>
<?php endforeach;?>
</tbody>
</table>
</div>
</div>
