Buffalo之 bind,reply,ajax,view,form应用(二)
Buffalo之 bind,reply,ajax,view,form应用(一)
http://liuzidong.iteye.com/blog/629893
三 数据绑定,提供html元素与后台Bean属性值相绑定
1 html代码
<TABLE id="testTbl" border="1" jheight="1">
<TR bgcolor="#FFCC00">
<TD jtext=id>
id
TD>
<TD jtext="firstName">
firstName
TD>
<TD jtext="middleName">
middleName
TD>
<TD jtext="familyName">
familyName
TD>
<TD width="300" bgcolor="#FFCC00" jtext="age">
age
TD>
<TD width="300" bgcolor="#FFCC00" jtext="sex">
sex
TD>
<TD jtext="interests">
interests
TD>
TR>
TABLE>
2 JS函数:绑定元素
buffalo.bindReply("userService.getUsers", [], "testTbl");
or
buffalo.remoteCall("userService.getUsers", [], function(reply) {
//获取返回源
//Buffalo.bind("area", reply.getSource());
Buffalo.bind("testTbl", reply.getResult());
})
//其它的绑定方式
Window.onload = function(){
var data = [
{value:'value1', text:'text1'},
{value:'value2', text:'text2',selected:true}
];
Buffalo.BindFactory.bindSelect($("sel1"), data);
var data = [
{value:'value1', text:'text1', addProp: '#1', addVal: 'Val1'},
{value:'value2', text:'text2', addProp: '#2', addVal: 'Val2'}
];
Buffalo.BindFactory.bindSelect($("sel3"), data, {
binder: function(data, option, index){
var v = data[index];
option.text = v.text + "-" + v.addProp;
option.value = v.value + "|" + v.addVal;
}});
}
<form id="form1">
<select id="sel1" jvalue="value" jtext="text" onchange="alert(this.value);">select>
<select id="sel2" jvalue="value" jtext="text">select>
<select id="sel3">select>
form>
//ajax调用简化
<script language="JavaScript" src="script/prototype.js">script>
<script language="JavaScript" src="script/buffalo.js">script>