jQuery Fill (by data)

Written by Arash Karimzadeh

Friday, 30 January 2009 09:59

When you want to fill a part of your html once and show it. You can use $(selector).bind(data,{fill:true}); which require jBind plugin.

jBind will bind will first find the html content of matched selector and fill it's content with assigned data. You can find out more by downloading it's sample package or reading it's documentation.

This feature is added in version 1.5.3

jQuery Fill Feature of jBind

This way you can fill a part like this with data:

<body>
    <div id='template'>
        <div class="content">
            <!--data-->
                <div class="viewBlock" id='{id}'>
                    <b>{name} {family}</b>, <i>[ Birthdate: {birthdate} ]</i>
                </div>
            <!--data-->
        </div>
    </div>
    <div id='show'></div>
</body>

Using:

$('#template').bindTo(data,{'root':'info',fill:true});

So the result is:

{geshibot lang="html4strict"}<body>
<div id="template">
<div class="content">
<div id="1" class="viewBlock">
<b>Scott Adams</b>, <i>[ Birthdate: June 8 1957 ]</i>
</div>
</div>
</div>
<div id="show"/>
</body>{/geshibot

You can download this file from jBind example package in download section.

Tags: jBind | jQuery | Plugin

Last Updated on Monday, 27 September 2010 12:34