CODEWITHSUNDEEP
phpajaxloopsforeach.post
Anu
Anu

Reputation: 131

Ajax POST inside a PHP foreach loop

I'm using $.post for posting some data, for eg, a variable, company name to a controller method, inside a php foreach loop. In the controller I echo back a bargraph that is plotted using the data that is passed. Now inside the foreach loop I'm dynamically generating an id which will be passed to a certain '' element and I need to plot this bargraph passed back inside that div. The code I'm using now is posted below:

    <?php
        $id=0;
        foreach($customer_companies as $data) {
            $company_name=$data->CompanyName;
            echo '<tr>
                  <script>function show_graph()
            {
                $.post("'.$base.'reports/single_bargraph/'.$company_name.'",      {},function(result){
                       $("#'.$id.'").html(result);
                });
             }                                  
        </script> 
        <td class="tablecntntgry" id="'.$id.'" height="45"> 
            <script type="text/javascript"> show_graph();   </script>                            
        </td>
      </tr>';
?>

Suppose, I have implemented pagination for fetching data $customer_companies, and 3 are displayed in page at a time. Now the problem that I face is the graph is not plotted in the id's specified.:( Sometimes, it would be plotted in the correct 3 td's generated but sometimes 2/3 would be plotted in the same td overlapping the other:( Can someone help me with this?

Upvotes: 1

Views: 1967

Answers (3)

Peter
Peter

Reputation: 16943

  1. $id is always zero in your sample.
  2. you need to make separate functions show_graph'.$i.'() (to be honest you don't need functions at all, put your $.post after the table)

Edit: Your script should looks like this:

<?php

echo "<table>";
foreach ($customer_companies as $id => $data) {    
    echo '<tr><td class="tablecntntgry" id="row' . $id . '" height="45"></td></tr>';
}
echo "</table>";

// NOTE i open <script> tag after </table> closing tag

echo '<script>';
foreach ($customer_companies as $id => $data) {
    $company_name = $data->CompanyName;
    echo '
    $.post("' . $base . 'reports/single_bargraph/' . $company_name . '", {},function(result){
        $("#row' . $id . '").html(result);
    });                                  
    ';
}
echo '</script>';

Upvotes: 0

Tim Joyce
Tim Joyce

Reputation: 4517

You really need to rethink your approach here, you are abusing the flexibility of javascript. You are defining the showGraph() function multiple times, so which version of the method do you expect javascript to trigger? Probably the first. Separate your js from your php.

<?php
        $id=0;
        foreach($customer_companies as $data) {
            $company_name=$data->CompanyName;
            echo '<tr id="'.$data['CompanyName'].'" class="companies"></tr>';
?>

$(function(){
   $('.companies').each(function(){
      $.post("'.$base.'reports/single_bargraph/'.$company_name.'",      {},function(result){
                       $(this).append('<td class="tablecntntgry">'+result+'</td>');
                });
   });
});

Upvotes: 0

user1741851
user1741851

Reputation:

Usually AJAX requests take time to get response. But by the time response arrives to client machine, you have overwritten the function!

I suggest you to put the script tag somewhere before your PHP foreach loop and alter the function to accept two parameters.

  1. Company Name
  2. result div ID

Upvotes: 0

Related Questions