I do not know if this is specifically a jquery problem, actually I think it has to mostly do with my logic in the php code.
What Im trying to do is make a voting system that when the user clicks on the vote up or vote down link in the web page, it triggers an ajax call to a php function that first updates the database with with the required value, on success of the database updating the another function is called just to get the required updated html for the that particular post that the user has voted on. (hope I havnt lost you).
The problem I think deals with specifically with this one line of code. When I make the call it only returns the value of $row-beer_down and completly ignores everything else in that line. Funny thing is the same php code to display the html view works perfectly before the ajax function updates it.
echo "<p>Score " . $row->beer_up + $row->beer_down . "</p>";
so here is the code to hope you can help as I have absolutely no idea how to fix this.
here is the view file where it generates the page. This part is the query ajax function.
<script type="text/javascript">
$(function() {
$(".vote").click(function(){
var id = $(this).attr("id");
var name = $(this).attr("name");
var dataString = 'id='+ id ;
var parent = $(this);
if(name=='up') {
$.ajax({
type: "POST",
url: "http://127.0.0.1/CodeIgniter/blog/add_vote/" + id,
data: dataString,
cache: false,
success: function(html) {
//parent.html(html);
$("." + id).load('http://127.0.0.1/CodeIgniter/blog/get_post/' + id).fadeIn("slow");
}
});
}
else
{
$.ajax({
type: "POST",
url: "http://127.0.0.1/CodeIgniter/blog/minus_vote/" + id,
data: dataString,
cache: false,
success: function(html) {
//parent.html(html);
$("." + id).load('http://127.0.0.1/CodeIgniter/blog/get_post/' + id).fadeIn("slow");
}
});
}
return false;
});
});
</script>
Here is the html and php part of the page to display the post.
div id="post_container">
<?php //echo $this->table->generate($records); ?>
<?php foreach($records->result() as $row) { ?>
<?php echo "<div id=\"post\" class=\"" . $row->id . "\">"; ?>
<h2><?php echo $row->id ?></h2>
<?php echo "<img src=\"" . base_url() . $dir . $row->account_id . "/" . $row->file_name . "\">" ?>
<p><?php echo $row->content ?></p>
<p><?php echo $row->user_name ?> On <?php echo $row->time ?></p>
<p>Score <?php echo $row->beer_up + $row->beer_down ?></p>
<?php echo anchor('blog/add_vote/' . $row->id, 'Up Vote', array('class' => 'vote', 'id' => $row->id, 'name' => 'up'));
echo anchor('blog/minus_vote/' . $row->id, 'Down Vote', array('class' => 'vote', 'id' => $row->id, 'name' => 'down'));
echo anchor('blog/comments/' . $row->id, 'View Comments');
?>
</div>
<?php } ?>
here is the function the ajax calls when it is successfull:
function get_post() {
$this->db->where('id', $this->uri->segment(3));
$records = $this->db->get('post');
$dir = "/uploads/user_uploads/";
foreach($records->result() as $row) {
echo "<div id=\"post\" class=\"" . $row->id . "\">";
echo "<h2>" . $row->id . "</h2>";
echo "<img src=\"" . base_url() . $dir . $row->account_id . "/" . $row->file_name . "\">";
echo "<p>" . $row->content . "</p>";
echo "<p>" . $row->user_name . " On " . $row->time . "</p>";
echo "<p>Score " . $row->beer_up + $row->beer_down . "</p>";
echo "<p>Up score" . $row->beer_up . "beer down" . $row->beer_down . "</p>";
echo anchor('blog/comments/' . $row->id, 'View Comments');
echo "</div>";
}