描述:页面数据为数组,需要对数组中的某个字段进行就地编辑。
页面适用情况示例:
1、在需要就地编辑的地方加上逻辑:(1)“就地编辑绑定”:变量名;(2)"就地编辑属性":点击“高级编辑”进行设置即可。 如下:
2、需要额外添加“绑定数据编程”
在上面的元素上添加逻辑事件:选“其他事件”,参数为:“save”;并且在下方添加绑定数据编程,点击“高级编辑”输入:
_vm.targetID( _ko.dataFor(_ctx.self[0])._id());
_vm.targetValue(_ctx.self.text());
_vm.sync2(true);
参数说明:
(1)targetID、targetValue为自定义变量,作用是将拿到的数组内的值,_ko.dataFor(_ctx.self[0])._id()意为取数组内循环的某变量,_ctx.self.text()取就地编辑时输入的值。
(2)sync2为数据层需要提交修改数据视口的层绑定的逻辑:“属性绑定”:{"data--sync":sync2} ,即“伪刷新”。意为:当点击页面就地编辑时弹出的“勾”时,即执行“save”事件时,进行sync2数据层的逻辑。
(3)需要对绑定的变量都进行初始化,以防报错。
3、最后一步:页面数据层处理
(1)关于第二步骤中绑定数据编程部分的另一种方案:
可将绑定的数据编程内容替换成如下代码:
var item=_ko.dataFor(_ctx.self[0]);
_vm.targetID(item._id());
_vm.targetValue(item.xinwenbiao7recommende());
_vm.sync2(true);
所达到的效果是一样的,其他地方不变。
参数说明:
_id即页面绑定数组的_id,xinwenbiao7recommende为页面“就地编辑绑定”的变量。
(2)关于就地编辑之后报错需要回显正确数据的操作补充(若需要,可添加处理):
在所提交的修改视口中,添加的关键代码段如下:
/*INSBEGIN:CONDITION*/
function(condition) {
if (!_.isEmpty(tmp_data.err)) {
return when.pipeline([
/*INSBEGIN:SEQUENCEIP*/
/*INSBEGIN:STDOUT*/
function() {
tmp_data.err.message._runCommand = [{
"command": "updatelv",
"params": [{
"sync": 1
}]
}];
throw tmp_data.err;
},
//@wweditorinfo:{"id":"cf760ed9cbd5d5e99d047f3b7ac9dad0","editor":{"jsonValue":{"success":true,"_runCommand":[{"command":"updatelv","params":[{"a":"newValue"}]}]},"steppurpose":{"purpose":"finishdata"}}}
/*INSEND:STDOUT*/
/*INSEND:SEQUENCEIP*/
function() {}
]);
}
return false;
},
/*INSEND:CONDITION*/
参数说明:
tmp_data.err:表示报错信息,需要在前面代码段手动将报错提示放入变量tmp_data.err中 ;
"sync": 1 :表示对页面读的视口进行伪刷新。
即:当报错提示(tmp_data.err)存在的时候,先刷新页面(使页面显示原有的真实数据),后在抛出提示信息。