AJAX Add to Favorites without refreshing page.

Posted on 2009-04-05
Last Modified: 2013-12-12
A little AJAX help please! All of the PHP code is functional and ready to go. All I need is some supporting AJAX to fill in the gaps. Here's what I need help with:

Part 1:
On my page, a user has a group of results. In each result, there will be a "Add to Favorite" button. When the user selects the "Add to Favorite" button, I would like it call my php function addFaves($MLS_ACCT) that inserts all info into the mySQL db without refreshing the page.

Part 2:
On the same page, in the right hand corner, there is a "My Favorites" div. After Part 1 is complete, I would like to refresh the "My Favorites" div to include the new results. The php function called in this div is getFaves($USER_ID).

Any and all help would be great!!!!! Thanks!
Question by:webseth
  • 4
  • 3

Expert Comment

ID: 24074203

Check this..

set the innerHTML of the favourites div to the html returned from the server

Author Comment

ID: 24074254
AJAX is completely over my head at the moment. I'm good with PHP but Javascript and AJAX are not languages that I'm at all familiar with. I'll have to take a look to try and understand the link. Maybe I can figure it out :)

Expert Comment

ID: 24079260
Read here:

Basically you can adapt the example to achieve the goal mahadevan suggests (because the example does fairly the same, keep reading). You say you already got the PHP part done and working - perfect! This PHP page you would call - with AJAX - in the way which in the example is:

<a href="javascript: getPage('home.php?','content')">Home</a>

Then see the JS part of the example to understand how AJAX works and read the walkthrough.

"set the innerHTML of the favourites div to the html returned from the server "

This is what the example does: setting the innerHTML of a DIV to the html content returned from server. The only difference between the example and your situation is, you're not importing HTML content of a static page (like the example does) but returning a parsed PHP page. The process is the same, only the nature of the page loaded differs.

Not sure I've been clear enough, but if you still have doubts let me know.


Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Expert Comment

ID: 24079345
Okay I re-read your post and I think I missed the point.

Part one:

Use AJAX POST. Example and working code here:

Trigger the function with the Add fav button. This will perform the operations from the PHP code in the MySQL database in a seamless manner, without submitting the whole page. User can keep browsing, AJAX will perform the POST asynchronously.

Part two:

Read this example and tweak it so not to refresh automatically but to trigger the retrieval of MySQL data on a specific event (e.g. click, whatever).

The example:
How to tweak:

This will retrieve and display MySQL results once the event fires the function.


Author Comment

ID: 24080375
I'm having a little trouble, plus my criteria has changed just a bit. New Rules:

1. There will be an "Add to Favorite" button, as well as a "Remove from list" button. Both actions will call a different remote file (one to add to a favorite, the other to remove that result permanently from the list).

2. The PHP code is still 100% complete, just need the AJAX help.

I tried striker46's TUT for adding, but I apparently suck at AJAX and am not getting it to work!!!

Expert Comment

ID: 24080443

I am writing a new tutorial which will be available either today or tomorrow. It deals specifically on how to change innerHTML of a DIV with a button click, just what was suggested to you above. So stay tuned and you will have the sample code, perhaps it will be easier than modifying the example mentioned above on your own.

This same tutorial will show you how to pass variables with AJAX, to the PHP file. So as far as I can now think of it, it should suffice to meet your needs. I'll report back here when I have it done, let you know the exact link and provide further assistance if needed.



Accepted Solution

striker46 earned 500 total points
ID: 24081544
There you go my friend:

And a small demo:

It works passing the MySQL and PHP vars thru GET.

I explained it as good as I could, and it is almost what you need for your example. The difference is, you might want to assign dynamically the MySQL variables in index.html JS functions; but with PHP knowledge this should be easy.

For further assistance, let me know.


Author Closing Comment

ID: 31566888

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
PHP mail() function not working... 8 31
PHP SMTP authentication 6 23
How do I fix this error with quotation marks? 4 23
JSON decode 5 14
Part of the Global Positioning System A geocode ( is the major subset of a GPS coordinate (, the other parts being the altitude and t…
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to dynamically set the form action using jQuery.

685 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question