URL Mapping - Ajax
Execute pre-configured ajax action based on url query string.
- Empty
?
- Ajax 1
?ajxload=1
- Ajax 2
?ajxload=2
- Ajax 3
?ajxload=3
- Ajax 4
?ajxload=4
- Ajax 5
?ajxload=5
- Trigger WET after Ajax 5 is inserted
?ajxload=5special
- Ajax two files (Ajax 4 and Ajax 2)
?special
- Ajax
ul
of two files (Ajax 4 and Ajax 2)?mspecial=ul
- Mapping the query string, load Ajax 3
?loadme=3
- Mapping the query string, load Ajax asdf
?loadme=asdf
but fallback on default "1"
Source code
HTML
<aside id="asidecontainer" class="col-md-5 pull-right">
<h2>Aside container</h2>
<p>Empty</p>
</aside>
<ul>
<li><a href="?">Empty <code>?</code></a></li>
<li><a href="?ajxload=1">Ajax 1 <code>?ajxload=1</code></a></li>
<li><a href="?ajxload=2">Ajax 2 <code>?ajxload=2</code></a></li>
<li><a href="?ajxload=3">Ajax 3 <code>?ajxload=3</code></a></li>
<li><a href="?ajxload=4">Ajax 4 <code>?ajxload=4</code></a></li>
<li><a href="?ajxload=5">Ajax 5 <code>?ajxload=5</code></a></li>
<li><a href="?ajxload=5special">Trigger WET after Ajax 5 is inserted<code>?ajxload=5special</code></a></li>
<li><a href="?special">Ajax two files (Ajax 4 and Ajax 2) <code>?special</code></a></li>
<li><a href="?mspecial=ul">Ajax <code>ul</code> of two files (Ajax 4 and Ajax 2) <code>?mspecial=ul</code></a></li>
<li><a href="?loadme=3">Mapping the query string, load Ajax 3<code>?loadme=3</code></a></li>
<li><a href="?loadme=asdf">Mapping the query string, load Ajax asdf<code>?loadme=asdf</code></a> but fallback on default "1"</li>
</ul>
<div data-wb-urlmapping='{
"ajxload=1": { "action": "ajax", "url": "ajax/ajax-1.html" },
"ajxload=2": { "action": "ajax", "url": "ajax/ajax-2.html" },
"ajxload=3": { "action": "ajax", "url": "ajax/ajax-{qval}.html", "match": "^\\d$", "default": "1" },
"ajxload=4": { "action": "ajax", "url": "ajax/ajax-4.html" },
"ajxload=5": { "action": "ajax", "url": "ajax/ajax-5.html" },
"ajxload=5special": { "action": "ajax", "url": "ajax/ajax-5.html", "trigger": true },
"special": [
{ "action": "ajax", "url": "ajax/ajax-2.html", "container": "#asidecontainer" },
{ "action": "ajax", "url": "ajax/ajax-4.html" }
],
"mspecial": [
{ "action": "ajax", "url": "ajax/ajax-2.html {qval}", "container": "#asidecontainer", "match": "(^ul$)", "default": "p" },
{ "action": "ajax", "url": "ajax/ajax-4.html {qval}", "match": "(^ul$)", "default": "p" }
],
"loadme": { "action": "ajax", "url": "ajax/ajax-{qval}.html", "match": "^\\d$", "default": "1" }
}'></div>
Ajax files
Page details
- Date modified: