Concrete Javascript Pattern
传统的client side js MVC 结构：Model:
json object - mapping with PO from server side
View:
HTML + CSS
Controller:
Page object - 负责页面初始化逻辑（验证、事件绑定、json数据渲染到DOM），提交时，获取DOM的数据组装json。
Concrete Javascript Pattern :
把status 和 behavior 直接绑定到DOM element上。
jquery concrete framework:
http://github.com/hafriedlander/jquery.concrete
http://github.com/nkallen/effen/
前者42k，后者0.8k。
与直接在DOM element object上添加status or behavior相比，框架的好处是可以批量添加。
用例：
对于autocomplete组件，formatted data = data name; saved data= data id;
之前有一个实现是为了save data id，多加了一个 input hidden.
如果是concrete js pattern, 可以在这个input element 上直接保存数据。
effen + jquery.autocomplete test:
$('body').append('<div id="dom_test"><input id="month"/></div>'); var monthInput = $("#month"); monthInput.fn({ dataPair: function(){ if (arguments.length == 0) { return this._data; } else { this._data = arguments; } }, _data: [] }); monthInput.autocomplete(months, { minChars: 0, max: 12, autoFill: true, mustMatch: true, matchContains: false, scrollHeight: 220, formatItem: function(data, i, total){ if (data == months) return false; return data.substring(0, 3); }, formatResult: function(row){ return row; } }); monthInput.result(function(event, data, formatted){ var _data = data.split("|"); monthInput.fn("dataPair", _data); console.dir(monthInput.fn("dataPair")); });
页:
[1]