In the header of my website, I have a horizontal list of the 6 latest posts. Now I would like to add a "previous" button, which causes the content of this list to be replaced by the 6 posts before the ones that are currently displayed. The idea is that, if a user clicks "previous" often enough, he is able to thereby see all posts ever made.
Most of the tutorials for creating this always load ALL posts, and then simply stuff them into some jQuery-slider. However, since I have 100+ posts, this seems not the best approach (some users might actually never click "previous" at all so why waste resources loading them).
Could you please point me to a tutorial that explains how I can get the previous posts using php each time the "previous" button is clicked? (I'm using Wordpress btw)
The problem was solved without any tutorial, just with the help of a few stackoverflow threads. Now I have an awesome Post-Slider :)
If you rely on php for that, you'll need to refresh the page each time. I think you really want an AJAX solution.
You can build a PHP web service that
1) accepts some variable, such as the ID of the lowest post currently displayed
2) outputs XML or JSON of the six posts prior to that
Then, on your page, onclick of your previous button, send the variable, accept the response, and place each post as needed. .ajax and .load are some jQuery methods to look into
Related
I'm currently only using PHP to take user submissions, put them in a database, and echo them out on a page using SQL to select from a table, such as comments. I need a system that will automatically update comments without refreshing the page like on YouTube. The less the user has to manually update, the better.
I want it to work pretty much exactly how YouTube and Twitter function, where it'll say "x NEW COMMENT(s)" and clicking that updates everything.
My teacher recommended a JQuery function, but I don't have any background in that language so I don't know where to begin looking.
I'm at a complete impasse. I will update this if you guys need additional information to aid in my search.
You are looking for AJAX
You will need a HTML page with jQuery/AJAX that calls another PHP page. In that PHP page you do the DB request and then ideally return the data as JSON so that your frontend part can display it to the user.
As every one says, AJAX is the way. You can find a simple blog I did on it here.
I have created a system using php from which we can add Status messages or you can say a kind of Microblog. So it has a database table like below :
posts_mst
------------------
post_id_pk
post_title
post_content
date_added
Now I have displayed all these posts on a page using select Query and it is displaying all the posts on a single page nicely. But now I have extended the page functionality and added a form to add these posts from same page. So that form stands on the very top of the page, and below it all the posts are getting listed.
I am storing all the posts using jquery .ajax() method so page do not load while saving any post. So now what I want to do is, when I add any posts, it should keep adding the same posts on the list in a real time, like you see in a Facebook - when someone posts on their wall, we see it loaded on the spot on our News feed. Here I want to do the same, as this page will be used by so may people and posts are displayed to everyone.
There is one way I can do this is - I can append a Div tag to the list of posts everytime a New post is added. This Div content I can get using Ajax response. But that will work for only My added post. If someone else adds the Post, I will not be knowing that.
So can anyone suggest me how I can implement this ? If there is any specific plugin used for that then let me know. :)
Thank you
The easiest way is to use a javascript setTimeout every X minutes / seconds and use ajax in the timeout function to check for new posts. You can track of what's new by storing a timestamp of the latest update in a session for example.
Note that this is periodic polling, it is not really realtime.
There are newer ways to maintain a permanent connection to the server, but that's a whole other story.
Okay I'm not really sure how to approach this. I have a user-generated post board where people post, it drops down onto a list of a bunch of posts. When you click on the ID number of the post it will bring you to a separate page with just that post and the comments on the post. I want it so when you hover over the href it drops down something that tells the user there are x amount of comments on this post. This way people know if there is comments without switching pages and also being able to be able to click the href still and go to the postid page.
I assume some ajax/jquery/javascript would be used to accomplish this but since I'm fairly new to ajax and jquery I'm not certain how this would be done. Thank you!
For a hover effect, it would be better if that information was already stored on the page and just hidden. Then when the user does hover, you can just un-hide it and have it positioned where you want, and then hide it again when their mouse leaves the area. Using AJAX requests for this purpose would waste away a lot of HTTP requests for such a tiny amount of information.
Really, you could do the hover effect using pure CSS if you wanted too (I would).
Since a hover happens fairly often, I wouldn't use it as the default event to fire an AJAX-request. This would increase the HTTP-traffic enormous. See if you can fetch this information when the page is build (and put it in then) or use something else like a "preview"-button for the event.
Anyways, this would be the basic workflow if you want/need to use AJAX:
Write a PHP-script (or any other language you use) which fetches the number of comments (and what else you want to display) from the database (or where your data is stored).
This script should then be called via AJAX (with $.ajax() from jQuery for example). As the expected return-type you would then use json.
The script which fetches your data would then create an object, use PHP's json_encode()-function to encode this object to JSON and echo it out.
This JSON-object will then be available in the success-method of the ajax()-method from jQuery. Then, you can access its members (e.g. the comment-count).
I am not sure the correct terminology for the process that I am trying to describe. I don't even know which platform is underlying the technique. If you understand my description, please give the link to the site(s) and or the keyword name of the process. I think it is done by AJAX, but I am not certain. I use php as the backend code, I just need to find a way to dynamically display the results. Please give suggestions. I forgot the name of the sites that use this, and my link history expired.
TIA
Description:
The page would have a search form and options. After the user submits, the search is initiated, and the results appear inside the dedicated result area. The page does not refresh, just the info inside the result area.
The display area will show 20 (or whatever) results (lines). There will be next, and previous buttons. If you hit next, the next set of results will display.
I am writing a code that generates 20 results for each display. There is no set number of results, so the results might have a start/first page, but do not have an end page.
Each time the user hits 'next', the program would generate/load new results. It would also store previous results, so that when a user hits 'prev', the previous results can instantly come up.
What techniques/program are theses?
Having recently handled pagination with Code Igniter (php framework), the following links might help you and anyone else out:
http://tympanus.net/jPaginate/
http://codeigniter.com/forums/viewthread/93045/
Usability is important and AJAX pagination introduces some important questions that need addressing regarding pagination, the following article will give some usability guidelines for displaying results in a table:
http://thedesignvanguard.com/crud-r-for-read
Code Igniter Prototype Framework Ajax Pagination:
http://codeigniter.com/wiki/AJAX_Pagination_with_CI_Pagination_Library/
Since we're using jQuery, we chose the following, Codeigniter jQuery framework for AJAX pagination
http://tohin.wordpress.com/2008/08/12/codeigniter-ajax-pagination/
http://tohin.wordpress.com/2008/10/07/codeigniter-ajax-pagination-exampleguideline/
It is not AJAX for sure.
Nobody uses AJAX for the pagination.
And there are about zillion pagination examples over internet
The only thing is never described in articles is how to persist search options for the other pages.
But it's simple enough: http_build_query() can help you
You need to have a GET/POST form submitted via AJAX which contains the fields in the search term and page number.
If you are going to set the page size to 20 results, page_num=4 will show results from 61-80 results.
Usually search results are GET instead of POST (Ex: See Google search results ) along with the page_number as another attribute and value.
#IVAN .. good to know that the library came helpful..
About that searching option; check the recent commit in github
http://github.com/neotohin/CodeIgniter-Ajax-pagination-Library there is an additional parameter added for searching.
I think the simple code in readme is enough for understanding the mechanism.
You could use datatables
https://datatables.net/
https://datatables.net/examples/data_sources/server_side.html
With this plugin using jquery also you could use server sided page request , you just have to handle the plugin post using Ajax.
post automatically sends row , page offset column, search criteria you just have to provide the json encode return
and the plugin automatically has library in featuring pagination, search sort number of rows per page and the table formatting.
Needed are jquery, and the plugin css and js for this to work
let me know if you understood my explanation.
thanks (=
I'm now developing comment system for my site on Ruby on Rails.
I try to make comments to be appeared when user click on SEE MORE button.
I see this is not like we do in pagination, so I need your little help guys!
When all comments have been displayed, the SEE MORE button should be removed from the page.
When the page loads, include a Javascript variable to indicate the "last item seen" or a time stamp (which I believe Twitter does as it orders the tweets in date order). You then have a Javascript function initiated by the setTimeout function which polls your server with this timestamp.
Your server then looks up to see if there has been any more posts since that point and if there has been, returns the number of results to the Javascript with an instruction to show a "See more" prompt - it also includes a new timestamp (if there are no new results, it just returns a timestamp).
Clicking on the "See more" prompt will then load in the new posts via Javascript, display them via the DOM and then reset the Javascript variable and repeat the process.
Of course, how you actually implement this will depend on how your data is structured, the server software you are actually using, what you actually want to do on the client side if there are new posts and then have often you want to "poll" the server for new responses (baring in mind more frequent polls will increase your server load).
Have you checked out this JQuery plugin. I believe it does pretty much exactly what you're looking for, and the example shows how to set it up using Rails. It's styled on the Facebook "Show more posts" pagination but this is basically the same as the "More" posts pagination as used by Twitter.