refreshing a top bar just like facebook where the no of messages are getting updated when the new messages comes just like facebook or gmail without refreshing the whole page . i can do this if that top bar is located externally i can refresh that bar with either meta tag set timeout or with refresh tag , but not getting how to refresh when it is part of main page.how to do this without reloading whole page and without any external file as the full code of the inbox and alert is located in main.php so i cant take it out and call these function externally.
maybe you can try to set a timer to pick new messages with ajax method and use js to change dom element's performance.
You need to use a partial page refresh using an AJAX callback. A good place to start learning AJAX is the Google Code University and the jQuery JavaScript framework.
Not sure what you want, but try this one: http://www.brightcherry.co.uk/scribbles/2009/02/26/jquery-auto-refresh-div-every-x-seconds/
Sujit, you definetly need to use AJAX. I think you have not explained yourself very clearly, but you are saying you want all the code on the same page, that's a bad programming practice. You need to use AJAX and have "code separation" (separate HTML from JS from PHP).
Maybe you are afraid of using AJAX, I recommend and easy library for managing AJAX, it's called SACK. You can see a nice an easy tutorial here.
Hope that works for you.
What about this then
setInterval(function(){
SomeAjaxFunction();
}, 1000);
Related
I am working on a social network website similar to facebook. But, I am facing a rather confusing stage in the programming.
I am done with the register/login/logout pages/scripts, and you can view profiles with the www.mywebsite.com/profile.php.
Now, I want to do what facebook does and allow users to click links while on their profile page (info, notes, photos) but never actually leave www.mywebsite.com/profile.php — just the appropriate content is printed to the screen.
How is this done? I am not asking anyone to code this for me, just point me in the right direction!
You can use Ajax for this purpose.
Put the content that you want to replace in a div and using ajax replace that div and only send that content.
Are you trying to do something like this?
http://www.99points.info/2010/05/how-to-create-dynamic-content-loading-using-ajax-jquery/
That will have to be done via Javascript and Ajax.
A javascript function will fire when the link is clicked. An ajax request is sent to the corresponding php script which sends back a response to your javascript function. You then parse this response and place it on the screen.
If you go that way, have a fallback option that does not rely on javascript as well in case a user has JS turned off.
You Can use this reference...
function showdiv(id)
{
if(id)
{
var selected_offer="yourpagename.php"
HTML_AJAX.replace('divname',selected_offer);
}
}
call showdiv on onChange() function of your link..
For this, you need the technique known as Ajax, which is short for asynchronous JavaScript and XML. The basic idea is that when the user does something - in your case clicks on a link or button - instead of loading a page, a script runs that calls on a server side script to send back some data. This is sometime XML, but you can get other types of data back as well. The asynchronous part is that the user and the page can go on doing other things while waiting on your script to return the data you asked for.
There's a good book for beginners in Ajax that I read myself: Head First Ajax. Looks like you can pick up a used copy for about $10. It's a nice intro, has a quirky style that appeals to some, and the authors do whatever they can to keep your attention. Hardcore programmers probably won't like this one, but I sense you're a little newer to the game and this may be a good read. Otherwise, Google "learning Ajax" and there are a bajillion resources.
Good luck!
To respond to your comment, you can set up a "router" script that takes input and runs a specific function in response. This "router" function looks at the $_GET[] superglobal for a parameter like "action" and then calls a corresponding function. If not action parameter is sent over, the router calls a default function.
Now for a little more detail. Your page script would have 3 basic parts: The router, the various action functions, and the page template function. The router just calls the appropriate function from the action functions and passes the output into the template function. Here are a few examples.
The user arrives on the page, index.php. No action is specified, so the router finds $_GET['action'] == '' and it calls default_action(). This returns a welcome message, status, whatever, and the router passes this output to the function that displays your page, output included.
Now the user clicks a link/button for updates and arrives at index.php?action=update. $_GET['action'] == 'update', so the router calls update_action(). The output goes on to the template function for display.
Does this help you envision how you might accomplish this?
How can i create something similar to the Facebook LIKE hyperlink which allows me to update mysql database without refreshing the page?
In other words , I need this hyperlink to update the database once i click it and display how many likes is stored in DB without page refresh.
Thanks in advace.
In plain simple words, you will need to use AJAX, which will get fired when you click the hyperlink, using JavaScript.
There are these options to use AJAX:-
Use JavaScript own functions to fire AJAX.
Use JavaScript libraries, like jQuery, Prototype, and some more.
By far, jQuery will suit every novice to its best & you can have a look in here for more details on AJAX.
Hope it helps.
in even simpler words than my predecessor;
this is what you have
//html
a href='somewhereOverTheRainbow'>LikeThis...
this is what you should have
//javascript
var likeIt=function(myAnchorElem){
//send info to ajax via Zepto, jQuery, Mootools, Dojo, ExtJS - you name it - or a standalone ajax lib
jQuery.get("somewhere.overtherainbow.com/like.php?url="+myAnchorElem.url);
//prevent the default
return false;
}
//html
a href='somewhereOverTheRainbow' onclick='return likeIt(this)'>LikeThis...
#javascriptWizards; I know, he should use addEventListener instead to then get a real event on which he can call preventDefault and more.
next to the ajax way, you could use json-p, an img or an iframe or even by using websockets. But for simplicity and ease, stick with the ajax way!
in general; making a feature such as the facebook like or google "+1" seams very trivial. The truth is far from it; it is one of the harder things to do in the web! The Frontend for it is easy like cake. But the Backend... wanting your website to scale and demanding/needing normal database respond times will bring you on to your knees
I'd suggest the AJAX approach but just to mention it, the effect could be achieved without AJAX by placing the button in an iframe, this iframe could then follow the the link without the page having to refresh.
http://infrequently.org/07/OSCON/sample_code.pdf
http://webdeveloper.econsultant.com/ajax-demos-examples-code-samples/
Some code sample
Im using ajax to call php which gets results from a mysql db.
Reason im using ajax is so that the page wont reload. (RETURN FALSE)
All works fine, but since the browser doesnt reload, there is no "back".
Example: Users enter something to search for, and hits "search button" and ajax returns the search without reloading page, BUT if the user wants to click the back button to get to the previous search, they cant...
If you think it would be better to actually reload the page then tell me because this is fully possible for me, only reason I dont reload page is because it looks better this way...
Or what do you guys think of iframes?
Thanks!
Take a look at this tutorial entitled "Fixing the Back Button and Enabling Bookmarking for AJAX Apps".
In conjunction with the answer to your question here, you could store their searches in an array. In the unload event, you could just do the previous search.
You can use jquery history plugin for this:
Try this simple & lightweight PathJS lib. It allows to bind listeners directly to anchors.
Usage example:
Path.map("#/page1").to(function(){
...
});
Path.map("#/page2").to(function(){
...
});
Path.root("#/mainpage");
Path.listen();
What is the best way to refresh the content of a var that is included? For example, I have this code:
<marquee>
<?php
include('note.php');
?>
</marquee>
This is great, as I can show on the page the contents of note.php. Say I change note.php but I don't want users refreshing to see the changes...is there any way to refresh the included file every 3 minutes for example?
To refresh only a portion of a page, you'll have to use some kind of Ajax Request : once the page has been sent to the browser, the server has done it's job, and cannot modify is anymore : the request of fetching a new portion of the page as to come from the browser.
You could do some Ajax requesting "by hand", it's not that hard ; but I'd rather suggest that you take a look at some of the great javascript frameworks that exists out there -- that might be helpful in the future, when adding more functionnalities to your application.
For instance :
With prototype, you can use Ajax.PeriodicalUpdater
Or, with jQuery, you could use something based on $.load
Only by using an ajax like call.. take a look at prototype or jquery for decent JS libraries to help with this..
Unless you just want to put some javascript in to refresh the page every three minutes, you'll need to look into another technology, namely AJAX. As far as I know, PHP can not do this alone.
Currently I'm doing this in two steps:
1.post it to ask.php
2.after inserting it into database,use header("REFRESH: 0;URL=post.html") to jump to the result page
But how to do it all in one step,say,like SO here?
SO does it using Ajax. But for the easier win, why not just use header('Location: http://example.com/post.html') instead of a refresh?
It happens using ajax, I'm guessing.
-User types post, hits submit.
-Post content is sent via ajax to the server where it tries to save it.
-If it is saved:
The post is added to the page using javascript and some pretty animations and all the various listeners are added to the clickable elements.
-If not:
Show some error.
I'm sure there's more to it than that, but that's probably the basic idea.
Instead of a that refresh header, after processing the POST request, tell the client to view the result with a Location redirection header
header("Location: http://www.example.com/post/$post_id");
That kind of thing is done with Ajax. Using javascript to request small(er) amounts of data from the server, then updating the page, bypassing a full page request/refresh.
Here's a few libraries that may help get you started with Ajax and PHP:
XAJAX
Zend_Json_Server (more complex)
PHP Ajax Example at W3Schools