Question

So I want my users to manage the site content themselves. For example when a customer/visitor is on the site, they see the content (each page content or paragraph stored in a database). If an employee is on the site, they should be able to login (or LDAP integrate) and for every <p> or <div> they should see a little edit icon next to it. When they click it, it turns the paragraph into a rich textbox where they can edit the content themselves.

This is something I’ve been thinking of for a while now but have never implemented and would like to try. Is there some tutorials or books I can start with? I can do this in either php or asp.net (mvc).

Answer 1

The concept is not complicated, here’s how I see it:

-When the user click on the edit icon, in javascript it takes whatever html code is inside the specified “div”, replace it with a text box (an html editor like tinymce would be even better) and place the existing html inside it.

-When the content has been edited, it should have a submit button. On submit it should make an ajax call to a server-side function that would save the content in your database.

-The last step would be to refresh the whole page or just the modified section via another ajax call.

Here’s a plugin for jquery that would simplify your work: http://www.appelsiini.net/projects/jeditable

and here’s the demo (simply click on the text to edit it): http://www.appelsiini.net/projects/jeditable/default.html

You could also implement a drag and drop function, so the users can place the “div” where they want.

Hope it helps