Codeigniter - Show Information in Modal Window - php

Question

I have a Modal Window. It is working good with javascript. I tried something myself but I can't show any information of Customer in Modal Window. When clicking on the info button, I want to show the Customer's information. How can I show any customer information in Modal Window?
Controller:
public function index()
{
$viewData['countries'] = $this->db->get("country")->row();
$viewData['customers'] = $this->customer_model->get_all();
$this->lang->load('content', $this->session->userdata('people_lang'));
$this->load->view('customers', $viewData);
}
public function getInfo(){
$cusId = $this->input->post('cusId');
$viewData['customers'] = $this->db->where("cusId", $cusId)->get("customer")->row();
$this->load->view('customers/getInfo', $viewData);
}
This Ajax Code:
<script type="text/javascript">
function showCustomers(str){
$.ajax({
type: "POST",
data: { cusId: str },
url: "<?=base_url('customers/getInfo');?>",
success: function(data) {
$('#divInfo').html(data);
}
});
}
</script>
This Modal:
<!-- Modal -->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Modal Tittle</h4>
</div>
<div class="modal-body">
<div id="divInfo"></div>
</div>
<div class="modal-footer">
<button data-dismiss="modal" class="btn btn-default" type="button">Close</button>
<button class="btn btn-warning" type="button"> Confirm</button>
</div>
</div>
</div>
</div>
<!-- modal -->
This View:
<a data-toggle="modal" href="#myModal3"><button class="btn btn-primary btn-xs" onclick="showCustomers(this.id);" id="<?php echo $customers->cusId; ?>"><i class="fa fa-eye"></i></button>
But This is not working. Where is I do mistake?

Answer 1

I think you can do this by adding a couple of lines.
Note* Code is not tested, i can practically painting the idea to solve this.
In the index function of your controller
public function index(){
$viewData['countries'] = $this->db->get("country")->row();
$viewData['customers'] = $this->customer_model->get_all();
//**new line
// Assuming you already have method in your Model to get customer by id
// Check if there's a GET request of 'customerID' then assign to the $viewDataByID array the data from the model, else nothing.
$viewDataByID['customersById'] = (isset($_GET['cusomterID'])) ? $this->customer_model->get_by_id($id) : '';
//Then you'll have to update the variable sent to the view by storing both in one array
$allData['viewData']= $viewData;
$allData['viewDataByID'] = $viewDataByID;
$this->lang->load('content', $this->session->userdata('people_lang'));
$this->load->view('customers', $allData);// $allData get sent to the view
}
In your modal you can sent the request
Please update the variables in the view. You can do a print_r($allData) or var_dump($allData) to clearly see the data tree and how you can make use of them.
Alternatively if you do not want to use your index for this, you can create another function within your controller to handle the customer by id, json_encode the result and then use jQuery to get the data.
Hope this helps.

Answer 2

Here's one way you could do it:
<!--modify button to include an onclick element, pass a value to it-->
<button class="btn btn-primary btn-xs" id="info_modal" onclick="show_modal('<?=$customer_name;?>')"><i class="fa fa-eye"></i></button>
You could modify your modal to have some id's in anticipation of your data:
<div class="modal fade" id="info_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
....
<div class="modal-body">
View File List According to Customer ID.
<div id="customer_name"></div>
</div>
Then in your script (if using jquery):
//add passed string to the modal and then display it
function show_modal(customer_name){
$("#customer_name").html(customer_name);
$("#info_modal").modal('show');
}

Answer 3

I answered myself this question.
<td data-title="Edit" align="center"><button class="btn btn-primary btn-xs"><i class="fa fa-pencil"></i></button> <a data-toggle="modal" href="#<?php echo $customer->cusId; ?>"><button class="btn btn-primary btn-xs"><i class="fa fa-eye"></i></button></a></td>
I edit a href like that href="#<?php echo $customer->cusId; ?>
Afterthat I just write this code on modal top:
<?php foreach ($customers as $get) { ?>
<div class="modal fade" id="<?php echo $get->cusId; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<?php } ?>
I edit id like that id="#<?php echo $get->cusId; ?>
It works better now!