<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<form id="add" method="post">
<input type="hidden" name="id" value="${device.id}"><br>
<c:set var="deptId" value=""></c:set>
<c:forEach items="${deptIds}" var="dd">
<c:set var="deptId" value="${deptId},${dd.deptId}"></c:set> /从后台穿过来的List集合,使用拼接,保证Controller抓参知道一个deptIds
</c:forEach>
<input type="text" name="deptIds" value="${deptId!=""?deptId.substring(1):""}">
设备名称:<input type="text" class="easyui-textbox" name="dname" value="${device.dname}"><br/>
设备类型:<input type="text" class="easyui-combobox" name="typeId" id="typecombobox" value="${device.typeId}"><br/>
设备库存:<input type="text" class="easyui-numberbox" name="stock" value="${device.stock}"><br>
设备价格:<input type="text" class="easyui-numberbox" name="price" value="${device.price}"><br>
设备分配:<ul id="treeDemo" class="ztree"></ul>
</form>
<script>
var treeObj;//定义了一全局的值,这个不重要
$("#typecombobox").combobox({
url:'${pageContext.request.contextPath}/type/list',
valueField:'id',
textField:'typeName'
});
//
var setting={
async:{//异步加载模式
enable:true,//开启异步加载模式
url:'${pageContext.request.contextPath}/dept/list'
},
check:{
enable:true
},
data:{
simpleDate:{
enable:true,
idKey:'id',
pIdKey:'pid',
},
key:{
name:'deptName',
}
},
callback:{
onAsyncSuccess:function(event,treeId,treeNode){//此处修改 的回显,
var arr=$("input[name=deptIds]");//当前是一个Dom对象
var ids = arr[0].value.split(",");
console.log(ids)
var ztreeObj = $.fn.zTree.getZTreeObj("treeDemo");
for(var i=0;i<ids.length;i++){
var node = ztreeObj.getNodeByParam("id",ids[i]);
console.log(node)
if (node != null)//判断弄得不为空的时候选中
ztreeObj.checkNode(node,true,false);
}
},
onCheck:function(event,treeId,treeNode){//此处添加
var nodes=treeObj.getCheckedNodes(true);
var arr=[];
for(var i=0;i<nodes.length;i++){
arr.push(nodes[i].id)
}
console.log(arr)
var did=arr.join(",");
$("input[name=deptIds]").val(did);
}
}
};
treeObj= $.fn.zTree.init($("#treeDemo"),setting);
$("#add").form({
url:'${pageContext.request.contextPath}/device/add',
onSubmit:function(){
return $("#add").form("validate")
},
success:function(data){
if(typeof data=='string'){
data=JSON.parse(data)
}
if(data.status==200){
$.messager.alert("消息提醒","操作成功")
$("#add-dialog").dialog("destroy");
$("#list-btn").datagrid("reload")
}else{
$.messager.alert("消息提醒","操作失败")
}
}
})
</script>
</body>
</html>
使用zTree在form表单中提交和修改回显
最新推荐文章于 2021-11-30 10:33:58 发布