Populating an array through jquery AJAX in php

Question

I have a function in a compare.php that takes a parameter $data and uses that data to find certain things from web and extracts data and returns an array.

function populateTableA($data);

So to fill array I do this

$arrayTableA = populateTableA($name);

now this array is then used to iterate tables..

<table id="tableA">
<input type="text" name="search"/><input type="submit"/>
<?php foreach($arrayTableA as $row) { ?>
  <tr>
     <td><?php echo $row['name']?></td>
     <td><?php echo $row['place']?></td>
  </tr>
</table>

Now what I want to do is to enter some data on input and then through jquery ajax

function populateTableA($data);

should be called and $array should be refilled with new contents and then populated on tableA without refreshing the page.

I wrote this jquery but no results.

$(document).on('submit',function(e) {
e.preventDefault();  // Add it here 
 $.ajax({ url: 'compare.php',
 var name = ('search').val();
     data: {action: 'populateTableA(name)'},
     type: 'post',
     success: function(output) {
                  $array = output;
              }
       });
});

I have been doing web scraping and the above was to understand how to implement that strategy... original function in my php file is below

function homeshoppingExtractor($homeshoppingSearch)
{
$homeshoppinghtml = file_get_contents('https://homeshopping.pk/search.php?category%5B%5D=&search_query='.$homeshoppingSearch);
$homeshoppingDoc = new DOMDocument();
libxml_use_internal_errors(TRUE); 
if(!empty($homeshoppinghtml)){
$homeshoppingDoc->loadHTML($homeshoppinghtml);
libxml_clear_errors(); 
$homeshoppingXPath = new DOMXPath($homeshoppingDoc);
//HomeShopping
$hsrow = $homeshoppingXPath->query('//a[@class=""]');
$hsrow2 = $homeshoppingXPath->query('//a[@class="price"]');
$hsrow3 = $homeshoppingXPath->query('(//a[@class="price"])//@href');
$hsrow4 = $homeshoppingXPath->query('(//img[@class="img-responsive imgcent"])//@src');

//HomeShopping
if($hsrow->length > 0){
    $rowarray = array();
    foreach($hsrow as $row){
        $rowarray[]= $row->nodeValue;
       // echo $row->nodeValue . "<br/>";
    }
}
if($hsrow2->length > 0){
    $row2array = array();
    foreach($hsrow2 as $row2){
        $row2array[]=$row2->nodeValue;
       // echo $row2->nodeValue . "<br/>";
    }
}
if($hsrow3->length > 0){
    $row3array = array();
    foreach($hsrow3 as $row3){
        $row3array[]=$row3->nodeValue;
        //echo $row3->nodeValue . "<br/>";
    }
}
if($hsrow4->length > 0){
    $row4array = array();
    foreach($hsrow4 as $row4){
        $row4array[]=$row4->nodeValue;
        //echo $row3->nodeValue . "<br/>";
    }
}
$hschecker = count($rowarray);
if($hschecker != 0) {
    $homeshopping = array();
    for($i=0; $i < count($rowarray); $i++){
        $homeshopping[$i] = [
        'name'=>$rowarray[$i],
        'price'=>$row2array[$i],
        'link'=>$row3array[$i],
        'image'=>$row4array[$i]
        ];
    }
}
else{
    echo "no result found at homeshopping";
}
}
return $homeshopping;
}

put your php file code, have you tried console.log(output) will it shows any data — rahul, Aug 23 '16 at 07:07
Php is a server-side language, javascript is client side, from the moment javascript is getting executed, Php is already executed. You can't update a php variable in javascript. — vincenth, Aug 23 '16 at 07:12
have you tried debug your ajax call for php file using echo exit? — rahul, Aug 23 '16 at 07:14
So there is no way to reload table contents without affecting the other tables? — Alex Parser, Aug 23 '16 at 07:15
@AmanRawat everything is in compare.php and the function populateTableA of course in php — Alex Parser, Aug 23 '16 at 07:16

score 1 · Accepted Answer · answered Aug 23 '16 at 07:30

As mentioned in the comments PHP is a server side language so you will be unable to run your PHP function from javascript.

However if you want to update tableA (without refreshing the whole page) you could create a new PHP page that will only create tableA and nothing else. Then you could use this ajax call (or something similar) -

$(document).on('submit','#formReviews',function(e) {
    e.preventDefault();
    $.ajax({ 
        url: 'getTableA.php', //or whatever you choose to call your new page
        data: {
            name: $('search').val()
        },
        type: 'post',
        success: function(output) {
            $('#tableA').replaceWith(output); //replace "tableA" with the id  of the table
        },
        error: function() {
            //report that an error occurred
        }
    });
});

So basically here is the plan! I am going to create a new php file that would only create table and then call it through ajax and put its html in a div — Alex Parser, Aug 23 '16 at 07:58

score 0 · Answer 2 · answered Aug 23 '16 at 07:16

0

Hi You are doing it in wrong way.You must change your response to html table and overwrite older one.

 success: function(output) {
              $("#tableA").html(output);
          }
   });

In your ajax page create a table with your result array

answered Aug 23 '16 at 07:16

Sanooj T

1,317
1
14
25

please look it his compare.php there are several changes needed to work with ajax – rahul Aug 23 '16 at 07:18

score 0 · Answer 3 · edited May 23 '17 at 12:33

You are in a very wrong direction my friend.

First of all there are some syntax error in your JS code.

So use JavaScript Debugging to find where you went wrong.

After that Basic PHP with AJAX to get a reference how ajax and PHP work together

Then at your code

Create a PHP file where you have to print the table part which you want to refresh.
Write an AJAX which will hit that PHP file and get the table structure from the server. So all the processing of data will be done by server AJAX is only used for request for the data and get the response from the server.
Put the result in your html code using JS.

Hope this will help

Populating an array through jquery AJAX in php

3 Answers3