Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I need to load $message1 and $message2 back into index.php when the corresponding anchors are clicked, with ajax, so that the new values are displayed in index.php without the page resfreshing. this code functions as is, I just can't figure out how to do this, could anybody help me figure out how? I've never written this type of script before and have gotten a little advice on how to do it but I'm still very confused.

this is my general.js file

$(".vote").click(function() {
var id = $(this).attr("id");
var name = $(this).attr("name");
var eData = $(this).attr("data-options");
var dataString = 'id='+ id + '&' + eData ;
var parent = $(this);

if(name=='up')
{
   $(this).fadeIn(200).html('');
   $.ajax({
      type: "POST",
      url: "up.php",
      data: dataString,
      cache: false,
      success: function(html){
         parent.html(html);
      }
   });
}
else
{
   $(this).fadeIn(200).html('');
   $.ajax({
      type: "POST",
      url: "down.php",
      data: dataString,
      cache: false,
      success: function(html){
         parent.html(html);
      }
   });
 }
 });

here is the html from my index.php

 <?php

 $sql = mysql_query("SELECT * FROM blogData ORDER BY id DESC");
 $sql2=mysql_query("SELECT * FROM messages WHERE mod(mes_id,2) = 0 ORDER BY mes_id DESC");
 $sql3=mysql_query("SELECT * FROM messages WHERE mod(mes_id,2) = 1 ORDER BY mes_id DESC");

 $count_variable = 0;

    while(($row = mysql_fetch_array($sql))AND($row2 = mysql_fetch_array($sql2))AND($row3 = mysql_fetch_array($sql3)) ){
        $id = $row['id'];
        $title = $row['title'];
        $content = $row['content'];
        $category = $row['category'];
        $podcast = $row['podcast'];
        $datetime = $row['datetime'];

        $message1=$row2['msg'];
        $mes_id1=$row2['mes_id'];
        $totalvotes1=$row2['totalvotes'];

        $message2=$row3['msg'];
        $mes_id2=$row3['mes_id'];
        $totalvotes2=$row3['totalvotes'];


    ?>

<table class="content">
 <tr>
 <td>


 <div id="main">
 <div id="left">
 <span class='up'><a href="" class="vote" name="up" data-options="key1=<?php echo $mes_id1;?>&key2=<?php echo $mes_id2;?>"><img src="up.png" alt="Down" /></a></span><br />
 <?php echo $totalvotes1; ?><br />
 </div>
 <div id="message">
 <?php echo $message1; ?>
 </div>
 <div class="clearfix"></div>
  </div>
 <div id="main">
 <div id="right">
 <br />
 <?php echo $totalvotes2; ?><br />
 <span class='down'><a href="" class="vote" name="down" data-options="key1=<?php echo $mes_id1;?>&key2=<?php echo $mes_id2;?>"><img src="down.png" alt="Down" /></a></span>
 </div>
 <div id="message">
 <?php echo $message2; ?>
 </div>
 <div class="clearfix"></div>
 </div>
 </td>
 </tr>
 </table>

 <?php
  }
  ?>

and here is my up.php file

 <?php

 session_start();
 include("config.php");

 $ip=$_SERVER['REMOTE_ADDR']; 

 $mes_id1 = $_POST['key1'];
 $mes_id2 = $_POST['key2'];
 $totalvotes1 = $_POST['key3'];

 $ip_sql=mysql_query("select ip_add from Voting_IP where mes_id_fk='$mes_id1' and ip_add='$ip'");
 $count=mysql_num_rows($ip_sql);

 $ip_sql2=mysql_query("select ip_add from Voting_IP where mes_id_fk='$mes_id2' and ip_add='$ip'");
 $count2=mysql_num_rows($ip_sql2);

 // if the user has already voted, execute script
 if($count==0 && $count2!=0)
 {
 $sql = "update Messages set totalvotes=totalvotes+1  where mes_id='$mes_id1'";
 mysql_query( $sql);

 $sql_in = "insert into Voting_IP (mes_id_fk,ip_add) values ('$mes_id1','$ip')";
 mysql_query( $sql_in);

 $sql = "update Messages set totalvotes=totalvotes-1  where mes_id='$mes_id2'";
 mysql_query( $sql);

 $sql_in = "DELETE FROM Voting_IP WHERE mes_id_fk='$mes_id2'";
 mysql_query( $sql_in);


 // if the user has not voted, execute script
 }
 else if($count==0 && count2==0)
 {
$sql = "update Messages set totalvotes=totalvotes+1  where mes_id='$mes_id1'";
 mysql_query( $sql);

 $sql_in = "insert into Voting_IP (mes_id_fk,ip_add) values ('$mes_id1','$ip')";
 mysql_query( $sql_in);

 }
 ?>
share|improve this question
 
Quick comment, look here: var eData = $(this).attr("data-options"); var dataString = 'id='+ id + '&' + eData ; You are sending an improper data string with Ajax.. ever value needs to have 'key=value' and those must be separated with '&'. eData doesn't have a key here. –  Klik Feb 20 at 2:36
 
Where did you define $message1 and $message2? –  icanc Feb 20 at 2:38
 
sorry... ill post that up top, let me edit it –  Patrick Lawler Feb 20 at 2:42
 
i just posted the rest of the index.php where I declared the variables –  Patrick Lawler Feb 20 at 2:47
 
@TheWeirdNerd the script works right now without doing that... the values are carried over and changed in my DB. or are you saying that changing the script you posted will make it function so that it displays back into index.php without reloading....? –  Patrick Lawler Feb 20 at 2:49
show 7 more comments

1 Answer

up vote 2 down vote accepted

In your first Ajax request, for example, you have set the url to up.php

   $.ajax({
      type: "POST",
      url: "up.php",
      data: dataString,
      cache: false,
      success: function(html){
         parent.html(html);
      }
   });

That means that you'll be retrieving data from up.php. The way that an Ajax request works is that ANY data displayed on the php page, after it's done loading, will be returned as a string to the page that sent the Ajax request.

In your up.php page, you have not put any echo statements or any html code. Thus there is no data in your success function being returned. Which makes parent.html(html) redundant.

You also cannot update variables on one php page from an Ajax request like you have specified. What you need to do is update the HTML data, or build the up.php page so that it returns a variable which you want to set to a Javascript variable in your success function....

i.e.

In up.php you must do the sql statement again, to retrieve the data that you want to change $message to and then echo that...

More or less like this: (very generalized I know)

$data = $_POST['ajaxRequestData'];
//do something with the data to create a new SQL statement

//do the sql statement and extract the value of $message that you're looking for
//THEN****
echo $message;

Next in your Ajax success function...

$.ajax({
      type: "POST",
      url: "up.php",
      data: dataString,
      cache: false,
      success: function(data){
         //here data will be equal to the value that you echoed in the up.php page.
         //do whatever you want to do with it... You will not have access to the php variable on this page with Javascript. 
         //Server sided languages like PHP do not talk directly with client sided languages like Javascript except with Ajax.

         updateMessage(data); //what I would do is create a function to send the variable to, to perform the necessary modifications to update your webpage.
      }
});
//Note that as soon as the success function ends, the returned data is no longer available to you 
//so you must pass it to a function (or a global variable) to be able to use it.
share|improve this answer
 
i edited the script and posted where i decalre the variables in index.php and all the variables are being defined and manipulated correctly right now with my php and in my database. the only issue is displaying them back into index.php –  Patrick Lawler Feb 20 at 2:52
 
so are you saying in my up.php file, I need to declare $eData = $_POST['eData']; and then post the $eData variable in my anchor? –  Patrick Lawler Feb 20 at 2:54
 
Thank you! ok so, $message1 = 1 and then up.php is executed and now $message1 = 2, and if I implement this script correctly it should be able to display that value back into the html in my index.php file...? –  Patrick Lawler Feb 20 at 3:24
1  
You cannot update $message1 with an Ajax request. Forget about trying to update the PHP variable. Instead update the div with the id message with a variable returned from an Ajax request. –  Klik Feb 20 at 3:30
 
Any more questions? Also if you managed to figure out your problem based on my answer, it would be nice to mark as an answer. Just sayin. –  Klik Feb 20 at 3:38
show 4 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.