Here I go again. I am trying to change content of a division with data retrieved from my database. This has to be done without reloading the page, therefore I am using xmlhttp and javascript. The website is running on CodeIgniter. Below is the code with a short summary of it. I have been following this tutorial, but for some reason, when I click the button, nothing is happening.
View *xampInstallFolder/htdocs/application/obs/views/test_v.php*
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$( "#next_btn" ).click(function() {
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("listA").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getnext5.php?q="true);
xmlhttp.send();
})
</script>
</head>
<body>
<div id="listA">
</div>
<div id="next_btn">
</div>
</body>
</html>
Right now I trigger the function when my button gets clicked. The function is in the head of the view,. I am not sure where should the file with the query (getnext5.php) be stored. Right now it is inside the views folder. The link to the file is this xmlhttp.open("GET","getnext5.php?q="true); should I somehow change this?
Functions xampInstallFolder/htdocs/application/obs/views/getnext5.php
<?php
$con = mysqli_connect('localhost','root','root','obs2');
if (!$con)
{
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"obs2");
$sql="SELECT * FROM user WHERE id > 5";
$result = mysqli_query($con,$sql);
echo "<table>";
while($row = mysqli_fetch_array($result))
{
echo "<a style="display:block" href="base_url('core/detail/'.$row[id])">";
echo "<div id="suggested" onmouseover="" style="cursor: pointer;">";
echo "<div id="info">";
echo "<div id="info_center">";
echo "<p>" . $row['name'] . "</p>";
echo "</div>";
echo "</div>";
echo "<div class="mosaic-block fade">";
echo "<a href="base_url('core/detail/'.$row[id])" class="mosaic-overlay">";
echo '<div class="details">';
echo "<p>" . $row['summary'] . "</p>";
echo "</div>";
echo "</a>";
echo "<div class="mosaic-backdrop"><img src="www.puu.sh/5DSWj.jpg">";
echo "</div>";
echo "</div>";
echo "<div id="info">";
echo "<div id="info_center">";
echo "<p>" . "Rating: 7.7" . "</p>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</a>";
}
echo "</table>";
?>
In this file I establish the connection to my DB, run the query, store the rows in an array called $pages and then style the results using a while loop. The style is echoed, because it is then returned by the xmlhttp request and displayed in the listA division, replacing the original content. I am not sure if the echoes are written right or not.
I am open to any suggestions. Have been trying to resolve this the whole day without any success. Thank you all for reading and most importantly for your replies.
