JSON Manager - Multiple data source to render a data table.

<div data-wb-jsonmanager='{
	"url": [
		"../wb-data-json/demo/data-en.json#/addressList",
		"../wb-data-json/demo/data-en.json#/addressList"
	],
	"name": "merged-source"
}'></div>

<!-- data-wb-json need to be set on the "table" element -->
<table class="table wb-tables" data-wb-json='{
	"url": "#[merged-source]",
	"source": "#tbl3",
	"mapping": [
		{ "selector": "a", "value": "/name" },
		{ "selector": "a", "value": "/homeUrl", "attr": "href" },
		{ "selector": ".streetAddress", "value": "/num", "placeholder": "[[num]]" },
		{ "selector": ".streetAddress", "value": "/street", "placeholder": "[[street]]" },
		{ "selector": ".streetAddress", "value": "/city", "placeholder": "[[city]]" },
		{ "selector": ".streetAddress", "value": "/postalCode", "placeholder": "[[pcode]]" },
		{ "selector": ".email", "value": "/email", "attr": "href", "placeholder": "emailAddress@example.com" },
		{ "selector": ".email", "value": "/email" }
	]
}'>

	<caption>Binding with the data table plugin <code>wb-tables</code></caption>
	<thead>
		<tr>
			<th>Name</th>
			<th>Street Address</th>
			<th>Email</th>
		</tr>
	</thead>
	<tbody></tbody>
</table>

<template id="tbl3">
	<table>
		<tr>
			<td><a href=""></a></td>
			<td>
				<span class="streetAddress">[[num]] [[street]], [[city]], [[pcode]]</span>
			</td>
			<td><a class="email" href="mailto:emailAddress@example.com">emailAddress</a></td>
		</tr>
	</table>
</template>