How to edit in place using AJAX?

If you are not familiar with how flickr handles editing data, here’s a short summary.

* Show user the data field normally (for instance: the title of a picture)

* When mouse rolls over that title, make the background of the word yellow

* If the user clicks on the word, change that word to a input box with the word in it. Also show a “save” and “cancel” button

* A user can rename the picture and then push “save.”

* Run a little script that updates the name into the database

* Remove the input box and the buttons and return to the original title display (updated with new title).
It shows how to write a little code to emulate flickr edit style effect almost perfectly.
The script is not using any third party libraries. There is a lot of html code involved, i don’t recommend it
if you intend to use a ‘plugin’ like edit in place script. On top of that, php and html is mixed together meaning more difficult to customize the script.

Download:http://www.ajaxlady.com/wp-content/uploads/2008/09/flickr-edit-in-place-ajaxphp.txt
Source:http://www.ajaxlady.com/text-processing-ajax-scripts/12-flickr-like-edit-in-place-ajax-script.html

Related Listings:

1. Ajax Instant Inline Text Edit Ajax Instant Edit Text User can edit the inline text...
2. Dynamic flickr Badge Script A work colleague who runs Tobago Retreats asked me to...
3. Query Flickr plugin Script jQuery Flickr plug-in is a JavaScript interface for Flickr Services...
4. Pulling Your Flickr Feed with jQuery Feeds are the easiest way to view updated content, whether...
5. Ajax Inline Quick Edit in Place Ajax Inline Edit in Place Script is a fast forward...

Do you like this post?

Email: