doT.js渲染列表数据和批量处理数据

1
<script src="../js/doT.min.js"></script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!--listTemp-->
<script type="text/x-dot-template" id="listTemp">
{{ for(var i=0;i
<it.length;i++){ }} <div class="list-item" data-c_name="{{=it[i].c_name}}" data-v_name="{{=it[i].v_name}}" data-materialspec="{{=it[i].materialspec}}"
data-nshouldassistnum="{{=it[i].nshouldassistnum}}" data-vbatchcode="{{=it[i].vbatchcode}}" data-cgeneralbid="{{=it[i].cgeneralbid}}" onclick="selectList(this,{{=i}})">
<div class="list-item-inner">
<div class="ibox">
</div>
<div class="cbox">
<dl>
<dt class="um-text-overflow mt10">{{=it[i].c_name}}</dt>
<dt class="um-text-overflow mt10">物料：{{=it[i].v_name}}</dt>
<dt class="um-text-overflow mt10">{{=it[i].materialspec}}</dt>
<dt class="um-text-overflow mt10">{{=it[i].nshouldassistnum}}KG</dt>
<dt class="um-text-overflow mt10">{{=it[i].vbatchcode}}</dt>
</dl>
</div>
<div class="icon-box" id="icon-box">
<div class="select icon-inner">
<div class="um-check-inline">
{{if(it[i].checked){}}
<input name="um-checkbox-inline" type="checkbox" value="" checked> {{}else{}}
<input name="um-checkbox-inline" type="checkbox" value=""> {{}}}
<span class="um-icon-checkbox um-css3-vc"></span>
</div>
</div>
</div>
</div>
</div>
{{ } }}
</script>

1
2
var dataText = doT.template($("#listTemp").text());
$("#list").html(dataText(data));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
//
点击当前列选中或者取消
function selectList(obj, i) {
var param = {
c_name : $(obj).attr("data-c_name"),
v_name : $(obj).attr("data-v_name"),
materialspec : $(obj).attr("data-materialspec"),
nshouldassistnum : $(obj).attr("data-nshouldassistnum"),
vbatchcode : $(obj).attr("data-vbatchcode"),
cgeneralbid : $(obj).attr("data-cgeneralbid")
//去重
}
// 发现自己的状态并改变
var flag = $(obj).find("input").prop("checked");
$(obj).find("input").prop("checked", !flag);
//
setArray(param);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
function setArray(arrSearch) {
if (arr.length == 0) {
arr.push(arrSearch);
} else {
var result = isInArray(arr, arrSearch);
if (result) {
arr.splice(result - 1, 1)
} else {
arr.push(arrSearch)
}
}
var length = arr.length;
var text = "收料(" + length + ")"
summer.setWinAttr({
actionBar : {
title : "待收料仓库",
titleColor: "#333333",
backgroundColor: "#007aff",
bottomLineColor: "#007aff",
leftItem : {
image : "",
method : ""
},
rightItems : [{
type : "text",
text : text,
textColor:"#333333",
method : "saveClose()"
}]
}
});
}

1
2
3
4
5
6
7
8
9
//判断是否在这个数组中存在
function isInArray(arr, value) {
for (var i = 0; i < arr.length; i++) {
if (value.cgeneralbid === arr[i].cgeneralbid) {
return i + 1;
}
}
return false;
}

1
2
3
4
5
6
7
8
9
10
11
12
13

// 点击保存
function saveClose() {
var arrSt = $summer.jsonToStr(arr);
//
summer.openWin({
"id" : "received",
"url" : "html/received.html",
"pageParam" : {
"arrSt" : arrSt
}
});
}

1
data = $summer.strToJson(data);