I'm following the tutorial here: http://www.jotorres.com/2012/01/using-jquery-and-ajax-with-codeigniter/
For my view, I have:
<script type="text/javascript" src="<?php echo jquery ?>"></script>
<button type="button" name="getdata" id="getdata">Get Data.</button>
<div id="result_table">
</div>
<script type="text/javascript" language="javascript">
$('#getdata').click(function(){
$.ajax({
url: "<?php echo base_url().'users/get_all_users';?>",
type:'POST',
dataType: 'json',
success: function(output_string){
$("#result_table").append(output_string);
} // End of success function of ajax form
}); // End of ajax call
});
</script>
The header and footer are predominantly links to other pages on the website but the relevant sections of the header and beginning are:
<!DOCTYPE html>
<!-- Website template by Jeremiah Tantongco, jtantongco@gmail.com -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $title ?> </title>
<link rel="stylesheet" href="<?php echo template ?>" type="text/css" />
<link rel="stylesheet" href="<?php echo display_elements ?>" type="text/css" />
</head>
Note: template and display_elements are variables pointing to css files somewhere on the server declared in config/constants
Note: jquery is a variable declared in config/constants that points to the newest jquery file on the server. It is the newest developer version available.
for controller methods:
public function test(){
$this->renderTemp_noData('users/test', 'Test page');
}
public function get_all_users(){
$query = $this->db->get('users');
if($query->num_rows > 0){
$header = false;
$output_string = "";
$output_string .= "<table border='1'>
";
foreach ($query->result() as $row){
$output_string .= "<tr>
";
$output_string .= "<th>{" . $row->uid ."}</th>
";
$output_string .= "</tr>
";
}
$output_string .= "</table>
";
}
else{
$output_string = "There are no results";
}
//echo $output_string;
echo json_encode($output_string);
}
public function renderTemp_noData($page, $title) {
$data['title'] = $title;
$accountType = $this->session->userdata('aid');
switch ($accountType) {
case 0:
$this->load->view('templates/LI_header', $data);
$this->load->view($page);
$this->load->view('templates/LI_footer');
break;
case 1:
$this->load->view('templates/LI_header_role1',$data);
$this->load->view($page);
$this->load->view('templates/LI_footer_role1');
break;
case 2:
$this->load->view('templates/LI_header_role2',$data);
$this->load->view($page);
$this->load->view('templates/LI_footer_role2');
break;
case 3:
$this->load->view('templates/LI_header_role3',$data);
$this->load->view($page);
$this->load->view('templates/LI_footer_role3');
break;
default:
redirect('/sessions/log_in/','refresh');
}
}
When I go to the page with the Get Data button, I press it and nothing happens. So if anyone knows how to expose the error message that would be great. Also, When I test to see output for get_all_users, this is what I get:
"<table border='1'>
<tr>
<th>{1}<\/th>
<\/tr>
<tr>
<th>{2}<\/th>
<\/tr>
<tr>
<th>{3}<\/th>
<\/tr>
<tr>
<th>{4}<\/th>
<\/tr>
<tr>
<th>{5}<\/th>
<\/tr>
<tr>
<th>{6}<\/th>
<\/tr>
<tr>
<th>{7}<\/th>
<\/tr>
<tr>
<th>{8}<\/th>
<\/tr>
<tr>
<th>{9}<\/th>
<\/tr>
<tr>
<th>{10}<\/th>
<\/tr>
<tr>
<th>{12}<\/th>
<\/tr>
<tr>
<th>{13}<\/th>
<\/tr>
<tr>
<th>{14}<\/th>
<\/tr>
<tr>
<th>{15}<\/th>
<\/tr>
<tr>
<th>{16}<\/th>
<\/tr>
<tr>
<th>{17}<\/th>
<\/tr>
<tr>
<th>{18}<\/th>
<\/tr>
<\/table>
"
Is JSON supposed to look this way? My gut says no but this is the first time I've ever used JSON, Jquery, and AJAX. Also, The numerical values are correct. Looking at my database, there are only UIDs 1-18 with no 11.