Menu

18 September 2013

Demo of Two way binding in Javascript using watchjs and Rivets.js !

I have updated my demos and it really looks cool. Want to share !!

So, I finally have very beautiful method of Two way binding between "DOM" and "Object Oriented JavaScript"

Example --

You can have perfect Sync between

THIS Model data
var PersonClass = function (name) {
this.name = name;
};
PersonClass.prototype = {
change : function (Event, TargetEle) {
this.name = "Chetan";
}
}

and

THIS DOM section !
<button data-on-click="scope:change">Change Model Data(1)</button>
<h3>Hello <span data-text="scope.name"></span></h3>
<input data-input="scope.name">

Full demo is available at http://jsfiddle.net/nsisodiya/y3gDP/

I guess, this will make life easy for many JS developers who want to decouple & sync DOM-UI and Model data



--
┌─────────────────────────┐
│  नरेन्द्र सिसोदिया
│  स्वदेशी प्रचारक, नई दिल्ली
│  http://narendrasisodiya.com
└─────────────────────────┘
Post a Comment