This is a post for beginners because that is what I am.
Today I was adding some Ajax to our site. Seeing that this is my first day of Ajax and that I only have very little experience with jquery, I thought it would be hard. So I started off with little things.
First, I wanted to add a summary to our authorlist page. But I'll talk about that in another article.
I wanted to provide users a way to access some of phpBB's built-in functionality without the need for a full postback, so that the user is not taken away from the page. I chose something simple and found out how you can do this with a bit of ajax and jquery.
This thing was there in the form of a link and I don't want to change any of the html since I still want that the way it is for people who use no javascript.
It is very easy.
- $(document).ready(function()
- {
- $("#id").click(function()
- {
- var str = $("#id").text();
- $.ajax
- ({
- type: "GET",
- url: $("#id")[0].href,
- success: function(msg)
- {
- $("#id").text(str == 'old' ? 'new' : 'old');
- }
- })
- return false;
- });
- });
First thing I found out was that I needed to return false to override the normal behaviour of a link. Without this, the normal postback will just take place and your script is pretty useless.
Next, I wanted to do the postback in an asynchronous way. For this I can use the jquery ajax method with type GET I just use the link that is there in the href ($("#id")[0].href) which is pretty cool since I could do this for an entire class of links. then I just change the text of the link if it is old then it becomes new else it becomes old.
Pretty simple I think. Although it took me some time to find out that if you have a syntax error somewhere in the jquery script, then it just does nothing. And if you do $("#id").text instead of $("#id").text() you will get some bizarre code that shows a function.
In the line success: function(msg) the msg parameter will contain the text that you would normally see on a normal postback.
Thanks to SQLDenis, AlexCuse and Remou for proofreading this article.




LTD Social Sitings
Note: Watch for social icons on posts by your favorite authors to follow their postings on these and other social sites.