Hey guys, I just created a news feed and I was wondering if there was a way to auto-refresh the feed with javascript or php, sort of like facebook, without refreshing the whole page. Thanks in advance.
You need to use a technology called AJAX to achieve this. As your question is not very specific the answer can't be either I'm afraid, but the general idea is a javascript running in the browser polls the server every couple of minutes for data, and the server returns some (XML in true AJAX, JSON, a HTML fragment, etc). The script then processes the data and modifies the DOM based on the results of the processing.
And to learn ajax i would recommend using jquery rather then reinventing the wheel. this tutorial will get you started http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery
also for the php side this will be helpful http://www.w3schools.com/php/php_ajax_intro.asp
Related
I need to run a search using Ajax, such that the response I get from Ajax (should not contain HTML, it should only contain data) is fetched on webpage and then parse that response with HTML on the page and display.
I want to know can it be done, if yes then how to do it. Also is it going to make process run faster or consume less resources on server?
Since you have made no attempt to try to code this, I will give you a couple pointers.
1.) It is very possible, I do it on login forms.
2.) Post data to a external page, then encode the response on that page to an array in JSON. echo out the JSON on the external page.
3.) After your ajax post is finished, you can carry out a function similar to this:
function(data){alert(data.given_name_on_external_page)}
or something similar. Once you google around for Ajax form examples you should be able to grasp a little better.
4.) Now for displaying this on a web page, it is fairly easy.
HTML
<div id='response'></div>
Javascript
function(data){document.GetElementById('response').html=data.data};
That should be enough for you to understand what needs to be done, I will leave the rest to you and your ability to use google :).
use escape and load() functionality in JQUERY
I'm trying to emulate the upvote/downvote system used on the SE sites. Each of my pages have a score which users can upvote or downvote.
The arrows are images with onclick links to javascript functions. I need to find a way to dynamically change the score without refreshing the page and then run a script (probably PHP) to increment the score in the server's data files.
Is javascript the best way to do this? I'm not that big of a fan of letting users see the source for my functions.
This is only possible using Javascript.
Don't worry about users seeing the source; as long as the server is secure and well-designed, it won't do any harm.
You should only implement display and validation logic in Javascript; everything must be validated again on the server.
Welcome to AJAX.
The easiest way to do that is to use jQuery and its $.ajax method.
See http://api.jquery.com/jQuery.ajax/
It's as simple as
$('a.upvote-button').click(function() {
$.ajax('/posts/123/upvote', {type: 'post'});
return false;
});
Yes, you need javascript (or something considerably less sane) to do this. Namely, you need an AJAX callback.
I'm not that big of a fan of letting users see the source for my functions.
The client-side source of your "function" would be ridiculously simple. It could be as simple as:
$.post('/1234567/vote/up')
You may use a direct link to a php script (and form post values) instead, and without a javascript library it would be a few more lines, but you shouldn't need to expose anything of value in your javascript.
Use javascript. JQuery is an excellent choice for manipulating on screen content and interacting with a server via asynchronous calls.
i have a php script who parser a rss and give me the data in a know pattern. Im very new with ASP, JavaScript and Jquery so i dont have any idea of how to autoupdate the script and display the new data with a smooth animation (see this example, that exactly what i want). Thanks for the support and if you know a good script to made this i will appreciate it.
Seems like you're looking for this:
http://leftlogic.com/lounge/articles/jquery_spy2/
It's PHP (not ASP), so that might be an issue, though the code is SUPER easy to implement (I've written by own implementation on three separate occasions).
The site itself has some decent documentation on getting things up and running, but if you need some extra help, comment and I'll point you in the right direction :)
Good luck!
The resources people have linked here are helpful and merely mentioning jQuery means you're probably headed in the right direction. But if you're new to this it might still be worth mentioning some of the concepts you'll be looking to play with here.
First of all, you'll probably want to stick with one language on the client side and one on the server side. This means choosing either PHP or ASP -- this isn't clear from your question but I'll assume you're dealing with PHP since that's the language I use for this kind of thing. JavaScript + jQuery is the right choice for the browser (client) side of things.
Like Luca points out, you'll have to set up some JavaScript code that goes live on page load and "polls" the server at a set interval. In JavaScript you do this using something called XMLHttpRequest (or "XHR") and it's pretty complicated. You could use combination of jQuery and a library like the one Matt points to in his answer, or just jQuery -- sample code abounds but it's basically a loop with a function call and sleep timer.
That function call is going to be one of the more difficult parts if you're trying to emulate the Twitter World Cup site. But here's the basic idea: You need to populate a list using jQuery and a data standard like JSON. Since the RSS feed you'll be parsing is written in XML, you'll have to write a server side (PHP/ASP) script that fetches, parses and converts the feed to JSON. In PHP, this is best done through cURL (file_get_contents() if you're lazy), SimpleXML and json_encode(), respectively.
Your JavaScript should load the list based on JSON. To do this, and display any new items, what you'll do is load the JSON from the client (browser) side using a jQuery method like getJSON(). Then you spin through the array object and add any new items to the list by adding new <li> elements to the "DOM." The same jQuery code that does this can easily also do the cross dissolve with something like fadeIn().
It looks like the script on that example page has an Ajax request running every TOT seconds.
You could simply have your PHP script return the RSS data (in JSON format say) and let JavaScript parse it and generate some HTML with it.
If all of this doesn't make sense to you I advice reading a little about JavaScript and PHP... there's plenty of good books.
What should I look into to accomplish this.
When you select an input field some text to the right shows up.
For example: https://twitter.com/signup
Anyway i need something like that works with PHP. What should I look in to?
And also How can you query the database and not have to reload the page to see result? For example i have seen on many sites registration you can check if the a username is used without the page reloading. Dont know how to explain better.
Thanks
Like Arkain said, they are making the text appear with JavaScript. PHP is server-side only, meaning it can't make any changes to the page once it has loaded.
You can however, call a PHP script dynamically (to check if a username is registered) using a technique called AJAX.
I'd look into Ajax using jQuery. I had done some things with ajax before trying jQuery but jQuery made it so easy that I found it enjoyable to keep implementing things using it.
You need to use JavaScript, look at this source for instance, for some beginner tutorials.
Learn JavaScript. You can start with jQuery (a pre-made javascript toolkit of functions that help you do many things without reloading the page).
Google for a jQuery Ajax tutorial.
I was wondering if there is a way to use php to return the values from a search without having to reload the whole webpage or using iframes or anything like that. I've tried searching for it but I always end up with AJAX and I was wondering if there is a PHP way for it...
I suggest you read up on AJAX and what it is, as it is exactly what you are describing.
What AJAX is generating a request on the browser with javascript, sending the request to a server, generating content with whatever technology you want (be it PHP, .NET, etc.) and returning it to the browser, without the page ever 'reloading'. That's all it is, and that's what you want.
I recommend you check out something like jQuery as it is far away the most popular javascript library. It makes doing AJAX requests a piece of cake.
AJAX is what you're looking for. It means using JavaScript (on the browser) to initiate a request to the server (which may be running PHP, or any other language).
PHP is a server-side technology, and what you describe is mostly a client-side issue.
Every technology that does what you want is going to be very close to Ajax, so I suggest to just take a little time and get yourself going with Ajax. There are plenty of javascript frameworks around that make life easier for you as an Ajax programmer.
PHP is server-side. It can't do anything unless a web request is made (i.e. the user clicks on a link, requesting a page). This is why AJAX exists. The javascript on the client side is able to initiate a web request in the background and decide what to do with the response.
Check out jQuery. It makes AJAX a snap:
http://docs.jquery.com/Ajax
Yes I did the same using PHp and Mysql. What you can do is first create a PHP search page1 with a text box and write down some jQuery function for the onkeyup event of text box. Pass the value of the Text Box to the PHP search page2 and display its data in another blank DIV tag on your search page1. Let me know if you were able to get the concept, else I will forward you some link for that. infact I found a youtube video for this. Its not a difficult task.