I would like to create a pagination system for comments in my website.So far, I have been able to create pagination using php/mysql and html but the page has to refresh every time we click on the next button(for the next set of comments) or previous or a particular page....
As far as my knowledge of jquery is concerned I am thinking that, when the user clicks on the next button we post data for the page number to comments.php then echo all the comments in comments.php, then the jquery data variable recieves all the data echo'd in the file and appends it to the #comments box...
Is my solution a valid one??? or anyone has a better solution.....thanks
Your question doesn't make much sense and is very jumbled.
You can either load the entire list when the page first loads, and use jquery to paginate it by hiding the extra entries, which will work fine for lists with a few pages worth of content.
The other option is to use AJAX to fetch the next or previous page when the appropriate link is clicked.
There are plenty of pagination add ons for jquery. Maybe check them out.
Don't use a POST request to get the next page as it looks like you might be, unless you are just using the wrong terminology.
Yes, when you click 'next', you send ajax request to comments.php and replace current comments with new ones.
You can do it with a get()/getJSON() call in jQuery.
Something like
$('#next').click(function(){
$.getJSON('url?withnextpage=number',
function(data){
//update variables or the DOM
});
});
Returning it in JSON may be quicker. I hope that helps
Related
It's another late night and another seemingly simple issue that's causing a headache!
So, here's the situation. I have a simple HTML form that's in a Bootstrap modal. When this form is submitted, there's an AJAX POST to a receiving page, SESSIONS are set and the request is then forwarded to a simple DB query. This all works.
What I want to do is show the sessions on the original page without a page refresh.
I thought this would be easy so I tried using this on the original page;
$('#filteroptions').on('hidden.bs.modal', function () {
$("#breadcrumbs").load('includes/files/private/breadcrumb.php');
});
breadcrumb.php holds the output format and the file is populated immediately after the POST from the modal (called filteroptions)
I also tried to attach it to the POST success with a simple success process to load the file but each time, the breadcrumb.php fils to be loaded.
Curiously, if I ctrl+F5 the page after the first POST, there is no value shown BUT if I search again the DIV is updated each time I search after that.
Why would the request not fire the first time that the search is performed? Why do I need to refresh the page for everything to start working?
There is no caching to it's not a case of a dependantr file being cached after the refresh.
Thanks
The solution was to populate the div with nothing and then update it.
Previously, the div was only being drawn when it was populated thanks to the code in the breadcrumb file looking for a specific POST or SESSION variable.
It now allows for a blank value.
I'm making a page which shows data, which is quite enormous.Tried pagination on it but didn't work the way I wanted. I'm looking for, something like "See more results", which on clicking will increase size of the page. Further, is it possible to do it with some limit on content to be shown on every click, like on every click it should show, say 10 or 15 rows ?
The best way to do this, in my opinion, is to cut the text and load just part of it with PHP. In this way the initial page won't be heavy. Then with a ‘Read more...’ button you can send an ajax request (with jQuery, maybe using the function load() function) you can get additional text, which will be appended in a div after the current text. Additionally, if you want to retrieve just some lines each time you press the button, you can check with jQuery how many div are already added (just adding a class to your new divs, you can check this just with $('#NameOfTheparent div.classOfTheNewDivs').length) and pass the variable to PHP, during the ajax request (so it won't be $('newDiv').load('something.php') but $('newDiv').load('something.php?var=numberOfDivAlreadyLoaded').
Well, this is the concept. :P
in my opinion, you need something like this:
http://andylangton.co.uk/articles/javascript/jquery-show-hide-multiple-elements/
i have a website that uses a number of containers (div's). In this scenario, we have three boxes down the left side and one bigger box on the right of these boxes. The bigger box on the right is the only thing that changes when a link is pressed, this is done with Javascript.
SO i have the index which is the main layout of the website and i also have the "pages" of the site, so when a link is pressed the main box (on the right) loads the new data.
On one of my pages i want to collect data and then run it through a PHP script that is in the head of the file, but when i click the button i realise it refreshes the whole page and it doesn't run the script on the page with the form.
Anyone had a problem like this, or know of something i could do to work around it?
I'm not really sure what code would be useful for helping me but if you need something just ask.
Thanks for the help
Since you are loading all your content via JS already, you could just POST the form data via AJAX to a PHP script to process, then read the output and either provide an error message or remove the form from the page and show your success message.
How to approach your AJAX call is dependant on what you've used as a basis for the rest of your JS.
Personally I like to use the JQuery library, as it makes AJAX calls (and much more) very simple.
How about you make the page design able to do it. Have the backend be able to spit out the state of the page when it posted.
Or use Ajax to post the data back and set the new state like you do already.
I'm currently working on a site and I would like to barrow the technique from Facebook on how the 'pagination' or 'view more' works. I think I have it sorted out but I'm just asking if this is the prefered approach or if I'm way off base.
I'd have a More button that when the user hovered or clicked upon it I'd fire off an ajax request.
The ajax request would pass two variables the limit and the current item (just like a normal pagination would work) and grab the results from the database and render them as necessary for the feed/etc.
I'd use jQuery's append to add an anchor link here so i could jump to the spot where the last post was. Then I'd append the results from the ajax request to the bottom of my feed/etc.
Fire the link to move the screen to the anchor tag and call it a day.
Anything I'm missing? Any flaws that you see that you could give me a heads up on... I'm currently using primarily PHP, MySQL, and jQuery as my weapons of attack.
Any assistance would be appreciated.
I have implemented this with similar idea.
When you click the "more" button,
remove that button.
Request with $.getJSON a page to get next page data.
append those to the content-page-div.
append the removed "more" button to the end.
I have a MySQL database with and id and a text string, I want to be able to display it, and with the click of a button display another random phrase without having to refresh the whole page.
I have look quite thoroughly and have no found no answer for this concrete question.
Is it possible to do it with PHP?
First try it WITH refresh.
You'll need to select a random text from your database (hint, use RAND() in your mysql request).
Once you know how to do that, learn how to make Javascript talk to your php page so you no longer need refresh. It's called AJAX, you can look at JQuery ( http://jquery.com/ ) for a library that will help you with it and specifically this page :
http://api.jquery.com/jQuery.ajax/
Your javascript will do a Ajax call to your php page, will get some data back and then will be able to display it in your page.
Look at the example, you should be able to do it from there.
But first do it with refresh, it's a first step.
If i were you i would use http://api.jquery.com/jQuery.get/
Create a page where you do the mysql query and then write a few lines of jquery to get the information from that specific page. You won't have to refresh the page and there are plenty of neat ways to change between the data you get from the database, with jquery
something like:
$.get("the_separate_page.php", function(data){
console.log('Your quote is : ' + data);
//check your log
});