I am working on a website that needs to paginate sql database results. The idea is like this, a user can click on a submit button with each US state's code to see all of the comments left by users from that state. For example clicking NY should display all people's comments from NY and clicking TX should display all of TX and so on. Displaying the results in one big list works but I want to paginate those results now. I am currently using this code located in its own paginate.php file which needs to be re-updated each time a new state is shown:
<?php
...
$rs_result = mysql_query($sql);
$row = mysql_fetch_row($rs_result);
$total_records = $row[0];
$total_pages = ceil($total_records / 10);
for ($i=1; $i<=$total_pages; $i++) {
echo "<a href='?page=".$i."'>".$i."</a> ";
};
?>
The code itself doesn't exactly work because it makes the page refresh. Doing that loses the memory of which state was previously clicked on. How can I change this to work with Ajax so I don't need to refresh the page. If you need more information let me know.
You need to wrap the results in a DIV that has an assigned ID and change the URL's to point a javascript function (I would recommend jQuery). The function has to get the data that will be displayed in that div.
eg:
<div id="results">
</div>
<?php
for ($i=1; $i<=$total_pages; $i++) {
echo "".$i." ";
};
?>
// and script
// the script asks result.php for page and returns html result.
<script type="text/javascript">
function getPage(page){
$("#results").load("result.php", { page: page } );
}
</script>
What you would do is make a AJAX call using the same thing you have in your href attribute. After the response take the data and place it into an html element on your page. Check out jQuery's load method.
Oh ya, just to keep our little movement going. You should try to stop using mysql_query() and start working with mysqli instead. mysql is deprecated and it is no longer being supported. :/
Related
I am trying to have my loop stop at 5 rows by default, but when the button is clicked it would load more. Are there any simple solutions for this? I don't want the page to refresh either.
My code below:
<?php
$count = 0;
while (($row = mysql_fetch_assoc($thequery))) {
echo $row['title'];
$count+=1;
if($count%5==0){
break 1;
}
}
?>
<span onClick="loadmore_somehow">Load More</span>
An AJAX call would do that. Using Javascript (and preferably a library like jQuery) you would make a call to your script and get more rows, pass them back, and then use Javascript to draw the rows. This does not reload the page.
http://api.jquery.com/category/ajax/
I think you need to know more about Javascript Ajax, It will help you do update,retrieve the content without refreshing page.
Check out this tutorial http://www.developphp.com/view.php?tid=1350
On my website an user is able to fill in an url. When he fills in the url, he gets all the images src's from that url. I push these src's to an array in php:
array_push($goodfiles,$pic);
Now the user will be able to choose on of the pictures (with a next or prev button) and then save it to the database. The picture that's saved is based on the id of the image in the array. So $goodfiles['0'] means id = "0" and so on.
I want the swapping of the images to work with ajax, so that the pages doesn't have to refresh all the time when clicking the next or previous button. And then when I save the form, I want to know the id of the current image, so that I can save it to the database.
How do I realize this with Ajax (jquery)?
Edit:
This is how I do it right now:
$current_id = $_GET['id'];
if(empty($_GET['id']) || !empty($empty)) { $current_id = 0; }
$prev_id = $_GET['id'] - 1;
if($prev_id < 0){ $prev_id = 0;}
$next_id = $_GET['id'] + 1;
if($next_id > $_SESSION['count']-1 && $_SESSION['count'] != 'empty') { $next_id = $_SESSION['count']-1;}
This is the code for the pagination
And this is the pagination:
<div id="url_pic">
<img src="<?=$_SESSION['pictures'][$current_id]?>" class="img_load"><br>
<? if($_SESSION['count'] > 1) { ?><center><img src="img/add/left.png"> <img src="img/add/right.png"></center> <? } ?>
</div>
So right now my solution doesn't contain any javascript, but it's all php coded. And the page refreshes everytime you want to see the next picture. I want to solve this in ajax, so that you can paginate through the images without a refresh. The way I want it is like this link:
http://d-scribe.de/webtools/jquery-pagination/demo/demo_options.htm
But except for the text, I want to paginate through images.
You probably don't need to use AJAX for this. Simply return a html file containing a JavaScript array, which contains all those image URLs and do the other stuff using JavaScript.
Get back to StackOverflow in case you've a more precise question and hopefully some code, which we can help on ;)
Load a script at the bottom of your php page the user side of the PHP where all your HTML is, above the closing body tag thats something loosely similar to this
<script type="text/javascript">
var myArray = <?php echo json_encode($myPHParray); ?>
</script>
this way when your page loads out it renders with a dynamic javascript json object as a variable that you can work with client side, this removes the need for an AJAX request all together unless your doing stuff with the data your playing with. From first glance Im guessing not really per say. But yea, at the very least its one less transaction to be made when the page is loading.
edit just noticed someone said similar while I was typing out.. Lars.. so I guess this is a follow up to his answer :-D
Ok I have a table that changes the displayed text once clicked on like the one displayed on http://www.w3schools.com/ajax/ajax_database.asp
I'm trying to update it based on each click.
For example.
Page Load > Load news article 1
onClick 1 > Load news article 2
onClick 2 > Load news article 3
All I want is for it to change based on each click, to a subsequent value. I have a php mysql database script that will pull the data from the database each time called.
The real question: Should I program the php to return a new table data cell with the new
oncLick="showNews($next_number)"
or should I leave that up to the AJAX, before it requests the information, just +1 it up.
I'm new to AJAX programming and not that experienced in PHP. I have searched everywhere and apologize if this is a redundant question. Just point me in the right direction.
write a php function to support to get the content by id. showNews(news ID). and then pass the newid with the ajax request. no need to change the newsid in the PHP.
I'm guessing something like this would be simplest:
var article = 0;
function showNews(){
get_article(article);
// magic
article+=1;
}
To be honest, just pick the way which seems more natural to you. Unless this is only a small part of something huge, it won't matter.
if I understood right, you want to get the next news when clicking on your button...
I suggest you to use jQuery for Ajax request...
It could be like this:
<script type="text/javascript">
$(document).ready(function(){
var result = 0;
$('#myButton').click(function(){
$.post('phpfunction.php',result,function(r){
$(document).append(r);
});
result ++;
});
});
</script>
And in PHP:
<?php
$result_id = $_POST['result'];
//SELECT * FROM WHERE id = $result_id;
?>
<?php
$nrows = mysqli_num_rows($result);
for (;$i<$nrows;)
{
echo"<tr>";
for ($j=0;$j<10&&$i<=$nrows;$j++)
{
$n = $i;
$i=$i + 1;
$k=$n%30;
$row = mysqli_fetch_assoc($result);
extract($row);
echo "<td><table width='100%' id=$Code>
<tr><td>$Code</td></tr>
<tr><td>$Name</td></tr>
</table></td>";
if ($k==0)break 2;
}
echo"</tr>";
}
?>
This is simple code for a sample table that i am working on. It being called in external file with $nrows and $i defined produces 10*3 table of 30 results. And called twice 60 results and so on.
I wish to add a showmore button to call this file. I worked around with div and ajax
I got pagination script and tried to work with it and added this button to it. and tried to get next page with ajax.
if ($currentpage != $totalpages) {
echo"<p><div id='more'><input name='ShowMore' type='button' id='$nextpage' onclick='showmore(this.id)' value='ShowMore' /></div></p>";}
The problem with this button is that it work good just First page is there while after that for every click next page appears but in place of other page.
I know problem is with div id which is constant. Is there any way to change it everytime one click on showmore.
I am also this thinking to work with mysql limit but unable to find a way to pass it to next table.
Any sort of help is welcome.
Thanx in Advance.
Could you make a javascript onClick function that alters the div's id and put it on the show more link?
well i finally devised a crude method. though I would not recommend anyone else to use it but it works perfectly. I have defined two different variable one in AJAX call and another in php script. and I increase them by one on each call. just because of simple mathematics of 1=1 and 2=2. It works perfectly. I am still looking for refined answer.
I have many tags. I want click each tag, then post/get the tag's value to another page.
In another page, received the values and make a mysql query. Then return the resalt data to the first page(do not make an iframe).
I think jquery post and load may be can do that (but have no idea how to combine two functiton). Or maybe there have any other way. Thanks.
here is my code
products.php
model:hml03
model:hml04
model:hml05<!--post value from products.php-->
data.php
<div id="data">
<?php
$result = mysql_query("SELECT id,name,details,add_date,model FROM ctw_products WHERE (MATCH (name,details,model) AGAINST ('+$_GET['get']' IN BOOLEAN MODE) Order By add_date DESC LIMIT 20 "); // get value with a mysql query
while ($row = mysql_fetch_array($result))
{
echo '<div class="name">'.$row['name'].'</div>';
echo '<div class="model">'.$row['model'].'</div>';
echo '<div class="details">'.$row['details'].'</div>';// how to return this part of datas back to products.php
}
?>
</div>
...<!--many other tags -->
<div class="show_data"></div><!-- get the data back show in here without refresh the page.
First you need AJAX to be able to do this. The simplest way to achieve this is use a library like jQuery
You can either download the library and include it locally or link to it directly from the jQuery site. the following code should allow you fetch data from data.php without a page refresh
<!--include the jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.js"></script>
<script type="text/javascript">
function get_data(get){
$.get('data.php?get='+get, function(data) {
$('.show_data').html(data);
});
}
</script>
Next, modify your links to call get_data onclick like this:
model:hml03
Notice how we pass the id of the product to get_data, you need to do this for every link.
I would recommend you read up on Ajax and JQuery to really get the idea.