Question

Wondering if there’s any jquery library/plugin that can easily perform the following.

1. At main page

Susan Liew (click here to update user profile)

When click, will trigger a lightbox type 2.0 style modal popup to show up a user profile modification form.

This should be ajax, jeffrey’s user profile primary key will pass into the modal popup (for complete user details retrieval via database).

After editing…. click save will auto close and doesn’t refresh the whole main page, but only refresh the this portion from

Susan Liew (click here to update user profile)

to

Susan Li (click here to update user profile)

At the same time, when modal popup, I want to make sure user not able to interact or press anything in main page.

How can I do that?

I have seen something like
http://www.no-margin-for-errors.com/projects/prettypopin/
http://www.no-margin-for-errors.com/demos/prettyPopin/ajax/form.html

But it seem lack of ability to pass the pass in the keys into modal popup, and return value required into main page after the update done.

Answer 1

I would recommend jQuery UI Modal.

You might want to read this SO post:
What’s your favorite jQuery modal plugin?