如何使用jquery post将php获取的数据用于html

Question

Hi i have a function in jquery and using $.Post to send data on a php file where my query is working fine and sending data back

js

function send_agenda_data(cidade_data){
        var data = {'cidade_data':cidade_data};
        $.post('includes/agenda_data.php',data,function(info){

        });
    }

This function works fine and when i alert the data coming back that also works fine

here is php

<?php
    include_once("connection.php");
    $cidade_data = $_POST['cidade_data'];

    if (isset($cidade_data)) {
        $sql = mysql_query("select * from agenda where cidade = '$cidade_data'", $con) or die(mysql_error());
        if (mysql_num_rows($sql) > 0) {
            while ($data = mysql_fetch_object($sql))
            {
                $date = $data->data;
                $cidade = htmlentities($data->cidade); 
                $estado = htmlentities($data->estado); 
                $local = htmlentities($data->local);            
                $endereco = htmlentities($data->endereco); 
                $site_local = htmlentities($data->site_local);
                $site_ingresso = htmlentities($data->site_ingresso); 
                $endereco = htmlentities($data->endereco); 
            }
        }
        else{
           echo "No Data";       
        }
    }

?>

this works fine if i use directly using php and echo the variables in tags now

    $.post('includes/agenda_data.php',data,function(info){
                //need data here            
});

i want to know how i can get the php returned data in js here and how i assign that data into tags. also want to know there is while loop in php is here will be also loop to populate all rows ?

if i use direct php in my webpage then i can use like this in while loop

<div><?php echo $date; ?></div>
<div><?php echo $cidade; ?></div>
<div><?php echo $estado; ?></div>
<div><?php echo $local; ?></div>
.
.
.

how can i get in $.Post case

Answer 1

Your loop is somewhat incorrect. You're simply fetching each row's data, and then overwriting the previous row's data in all those variables. You should be building an array of results, which you can then send over to the client-side JS code. e.g. something like

$data
while($row = mysql_fetch_assoc($result)) {
     $data[] = $row;
}

echo json_encode($data);

On the client side, you'll receive an array of objects you can iterate over:

$.post('includes/agenda_data.php',data,function(data){
    $.each(data, function(idx, row) {
        $('#date').innerHTML = row['date'];
        ...
    });
});

exactly what you do in that JS loop is up to you.

As well, note that your PHP code is vulnerable to SQL injection attacks.