Load different data in popup on buttotn click for different rows - php

Question

I have a table which shows multiple rows data taken from database.
There is one button in every row. So what i want, when i click on the button it should be show a popup and data would be shown of that particular row.
for example, when i click on button on the first row, popup with the data of first row will be shown.if i click the button on second row, the data of second row will be shown.
The problem is, when i click on the button of the first row or second row i am getting the same data in the popup of two different row.
so, how can i get the different data in every popup related to different rows?
This my code of view in which i have taken value from controller and shown
CONTROLLER
public function get_job()
{
$data['result'] = $this->user_model->view_job();
if (!empty($data['result']))
{
$this->load->view('admin_view',$data);
}
else
{
$email = $_SESSION['email'];
$data['result'] = $this->user_model->get_username($email);
$this->load->view('no_job',$data);
}
}
MODEL
//To get recently added jobs by inner join
public function view_job()
{
$this->db->select('add_job.*, crm_accounts.company');
$this->db->from('add_job');
$this->db->join('crm_accounts', 'add_job.cid = crm_accounts.id', 'inner');
$this->db->where('add_job.status', 'NEW');
$query = $this->db->get();
return $query->result_array();
}
VIEW
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Id</th>
<th>Job Id</th>
<th>Job Name</th>
<th>Company Name</th>
<th>Company Id</th>
<th>More</th>
</tr>
</thead>
<tbody>
<tr>
<?php
foreach ($result as $object)
{
?>
<td><?php echo $object['id']?></td>
<td><?php echo $object['job_id']?></td>
<td><?php echo $object['job_name']?></td>
<td><?php echo $object['company']?></td>
<td><?php echo $object['cid']?></td>
<td>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal">
Details
</button>
</td>
</tr>
<div id="MyModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title"><h3>Company Name :<?php echo $object['company']?></h3></div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>
</td>
</tbody>
</table>

Answer 1

Reason for same modal is opening each time you click on different row's button is the same ID of each modal. What you need to do is change the data-target of modal to be different for each row. To do this append counter or the ID or the row after the DIV ID of the modal.
Like this,
Your button code will look something like this,
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal<?php echo $object['id']?>">
Details
</button>
And code of Modal will look something like this,
<div id="MyModal<?php echo $object['id']?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title">
<h3>Company Name :<?php echo $object['company']?></h3>
</div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>

Answer 2

<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Id</th>
<th>Job Id</th>
<th>Job Name</th>
<th>Company Name</th>
<th>Company Id</th>
<th>More</th>
</tr>
</thead>
<tbody>
<tr>
<?php
foreach ($result as $object)
{
?>
<td><?php echo $object['id']?></td>
<td><?php echo $object['job_id']?></td>
<td><?php echo $object['job_name']?></td>
<td><?php echo $object['company']?></td>
<td><?php echo $object['cid']?></td>
<td>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal_<?php echo $object['id']?>">
Details
</button>
</td>
</tr>
<div id="MyModal_<?php echo $object['id']?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title"><h3>Company Name :<?php echo $object['company']?></h3></div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>
</td>
</tbody>
</table>
Try this code. i thing. you problem will resolved.