I have 2 php files(index.php and lelong.php). I am trying to load the html first in the index.php (table) and display the word(Calculating...) on the second column while the lelong.php extracting the data from the website before outputting them.
Is there a way to do that? I heard of using JS or AJAX but not really sure how to do it.
Index.php
<!DOCTYPE html>
<html>
<head>
<?php include 'lelong.php'; ?>
</head>
<body>
<table border ="1" style = "width:50%">
<tr>
<td>E-Commerce Website</td>
<td>No. of Products </td>
</tr>
<tr>
<td>Lelong</a></td>
<td><?php echo $lelong; ?></td>
</tr>
</table>
<body>
lelong.php
<?php
$grep = new DoMDocument();
@$grep->loadHTMLFile("http://www.lelong.com.my/Auc/List/BrowseAll.asp");
$finder = new DomXPath($grep);
$class = "CatLevel1";
$nodes = $finder->query("//*[contains(@class, '$class')]");
$total_L = 0;
foreach ($nodes as $node) {
$span = $node->childNodes;
$search = array(0,1,2,3,4,5,6,7,8,9);
$number = str_replace($search, '', $span->item(1)->nodeValue);
$number = preg_replace("/[^0-9]/", '', $span->item(1)->nodeValue);
$total_L += (int) $number;
}
$lelong = number_format( $total_L , 0 , '.' , ',' );
?>
Thanks
Assuming lelong.php
is already working fine, yes you could use ajax to get the result:
Basic example:
So in your HTML:
<table border ="1" style = "width:50%">
<tr>
<td>E-Commerce Website</td>
<td>No. of Products </td>
</tr>
<tr>
<td>Lelong</a></td>
<td class="result_data">Calculating ...</td><!-- initial content. Loading ... -->
</tr>
</table>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
$(document).ready(function(){
// use ajax, call the PHP
$.ajax({
url: 'lelong.php', // path of lelong
success: function(response){
$('.result_data').text(response);
}
})
});
</script>
Then in your PHP:
<?php
$grep = new DoMDocument();
@$grep->loadHTMLFile("http://www.lelong.com.my/Auc/List/BrowseAll.asp");
$finder = new DomXPath($grep);
$class = "CatLevel1";
$nodes = $finder->query("//*[contains(@class, '$class')]");
$total_L = 0;
foreach ($nodes as $node) {
$span = $node->childNodes;
$search = array(0,1,2,3,4,5,6,7,8,9);
$number = str_replace($search, '', $span->item(1)->nodeValue);
$number = preg_replace("/[^0-9]/", '', $span->item(1)->nodeValue);
$total_L += (int) $number;
}
$lelong = number_format( $total_L , 0 , '.' , ',' );
echo $lelong; // output lelong
exit;
?>
The effects on the front are yours to control. You could use plugins for that.
In your lelong.php
page, Add a line echo $lelong;
At the end.
In your index.php
, remove <?php include 'lelong.php'; ?>
, and import JQuery library. For example <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
Replace <td><?php echo $lelong; ?></td>
by <td id='lelong'>Calculating...</td>
Add jquery code <script>$('#lelong').load('lelong.php');</script>
It's better for you to learn jQuery first.