Retrieve and display multiple and different mysql queries using jquery ajax

Question

I have several div tags that I would like to be updated with several different mysql queries.

My code below only updates one of these divs, how can I expand it to 1-6 and also leave room for expansion in the future for more divs?

I also need to be able to update each div individually with a specific query for a specific table.

<html>

<div id="1"> </div>
<div id="2"> </div>
<div id="3"> </div>
<div id="4"> </div>
<div id="5"> </div>
<div id="6"> </div>
//...and so on

</html>

<script type="text/javascript">

$(document).ready(function () {
function display($id) {
    $.ajax({
        async: false,
        type: "POST",
        url: "apifile.php",
        data: {id:$id},
        dataType: "json",
        success: function(msg) {
            if(msg.success) {
                $($id).next(".one").html(msg);
            } else {
                alert("error");
            }
        }
    });
}

</script>

<?php

mysql_connect(host, user, pass);
mysql_select_db(name);
mysql_query("select round((count(*)*100)/(select count(*) from test),1) as percent from test group by field1 order by percent desc");

$reply['success'] = "Success"; 
if($return = display($id)) {
    $reply['success'] = "Success";
} else {
    $reply['error'] = "Error";
}
echo json_encode($reply);

?>

Why not just make one Ajax call and return an array of the data you need? (given its the Se database) Then you can just loop through that array with jQuery printing the DIVs and the data as you go. — Luke Peterson
– Luke Peterson, Commented Mar 11, 2015 at 11:05

ambe5960 · Accepted Answer · 2015-03-11 11:15:19Z

1

you can store the data/messages/otherinfo from each query in different portions of your $reply array

query1 goes here ...

   $reply[1]['success'] = "Success"; 
if($return = display($id)) {
    $reply[1]['success'] = "Success";
} else {
    $reply[1]['error'] = "Error";
}

query2 goes here ...

$reply[2]['success'] = "Success"; 
$reply[2]['data'] = "3,4,5"; 

query3 goes here ...

$reply[3]['success'] = "Success"; 
$reply[3]['data'] = "beans,soup,guac"; 

echo json_encode($reply);

answered Mar 11, 2015 at 11:15

ambe5960

1,9803 gold badges23 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Teodor · Accepted Answer · 2015-03-11 11:07:08Z

1

You can add a class to the div and run the ajax on class

$( ".div" ).each(function() {
    var div_id = $(this).attr('id');
    display(div_id);
});

answered Mar 11, 2015 at 11:07

Teodor

436 bronze badges

Collectives™ on Stack Overflow

Retrieve and display multiple and different mysql queries using jquery ajax

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related