Modal Windows - Javascript/Jquery

[WebWatcher]

Is there a way you can transfer data when a user clicks on a modal window link and it opens up?

Any help would be appreciated

Thanks

[sander k]

What kind of data?

[TehGuy]

Yup, but you gotta be a little more specific. Did you make your own modal solution, or are you using jQuery UIs?

What do you mean by transfer data? Loading content on the modal only when it's clicked? POSTing or GETing data to another page?

[SitesTen]

If you want to transfer data on the background without the page to be refreshed, you need to use AJAX calls. Data can be serialized as JSON object. You have to search the Internet about more information on those two topics as it cannot be explained that easily in a single post.

[TehGuy]

Easy enough to show how it works in one post, but you're right, it's tough to explain all the concepts all at once. There's a lot involved for the whole process, even if it boils down to ~10 lines of code. You need some knowledge of html/css, javascript/jQuery, a server-side scripting language, and JSON. I don't know what type of experience WebWatcher has with each of these, but here's an example that goes through the whole thing:

http://jsfiddle.net/pr4bB/2/

So, given a javascript object, you can encode the object into a JSON string. You can then send the JSON string to a server-side script of yours, process it however you want, and send a response back to your page.

In the example I posted, here's what happens:

1. A generic javascript object is created.
2. A JSON string is generated for the object using a jQuery add-on (http://code.google.com/p/jquery-json/).
3. When the user clicks the button, the JSON string is POSTed to a server-side script.
4. A response is given (in this case, the script doesn't return anything).
5. A modal window is created (using jQuery UI), and the response from the script is appended.



And if you're just loading content from another page, it's even easier:

http://jsfiddle.net/xGaZL/2/

jsfiddle doesn't really have any pages that work for loading, so you just have to pretend the modal has content from another page haha)