diff --git a/README.md b/README.md
index d30e055..72cca15 100644
--- a/README.md
+++ b/README.md
@@ -180,6 +180,8 @@ and make your AJAX request in the link's click handler. Note that you need to ma
return false;
});
+Note that the AJAX response must be wrapped in a div with class modal
when using the second (manual) method.
+
# Contributing
I would love help improving this plugin, particularly with:
diff --git a/examples/ajax2.html b/examples/ajax2.html
new file mode 100644
index 0000000..37afb96
--- /dev/null
+++ b/examples/ajax2.html
@@ -0,0 +1,3 @@
+
Second AJAX Example!
+This example loads HTML with AJAX.
+ +This first example uses rel="modal:open"
to automatically load the page contents into a modal via AJAX:
<a href="ajax.html" rel="modal:open">example</a>
+
+This second example shows how you can manually load AJAX pages into a modal. Note that the AJAX response must be wrapped in a div with class modal
:
<!-- Normal link -->
<a href="ajax.html" id="manual-ajax">second example</a>
+
+// Open modal in AJAX callback
+$('#manual-ajax').click(function(event) {
+ event.preventDefault();
+ $.get(this.href, function(html) {
+ $(html).appendTo('body').modal();
+ });
+});
+
+<!-- AJAX response must be wrapped in the modal's root class. -->
<div class="modal">
<p>Second AJAX Example!</p>
</div>
If you want more spinner styles, check out ajaxload.info.
@@ -188,6 +205,13 @@