You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
310 lines
11 KiB
310 lines
11 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title></title>
|
|
<link rel="stylesheet" href="../../../component/pear/css/pear.css" />
|
|
<style>
|
|
.require-star {
|
|
position: absolute;
|
|
width: 3px;
|
|
height: 14px;
|
|
background-color: #ea4335;
|
|
top: 12px;
|
|
right: 8px;
|
|
border-radius: 1.5px;
|
|
}
|
|
|
|
.input-width {
|
|
max-width: 455px
|
|
}
|
|
|
|
.layui-form-select {
|
|
width: 455px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<form class="layui-form" action="">
|
|
<div class="mainBox">
|
|
<div class="main-container">
|
|
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label" style="width: 100px !important;"><span
|
|
class="require-star"></span>民族1</label>
|
|
<div class="layui-input-inline" id="testView"></div>
|
|
<script id="testScript" type="text/html">
|
|
{{# layui.each(d, function(index1, item){ }}
|
|
|
|
{{# if(item.children.length==0){ }}
|
|
<input type="checkbox" id="chk_{{item.group_name}}" value="{{item.subject_code}}" name="{{item.subject_code}}" title="{{item.name}}" ><br>
|
|
{{# } else { }}
|
|
<input type="checkbox" id="chk_{{item.subject_code}}" title="{{item.name}}" lay-filter="childChk"><br>
|
|
{{# layui.each(item.children, function(index2, clildItem){ }}
|
|
<input type="radio" id="rdo_{{item.subject_code}}" name="{{item.subject_code}}" value="{{clildItem.subject_code}}" title="{{clildItem.name}}" lay-filter="childRdo">
|
|
{{# }); }}
|
|
<br>
|
|
{{# } }}
|
|
{{# }); }}
|
|
|
|
</script>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
<div class="button-container">
|
|
<button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit="" lay-filter="save">
|
|
<i class="layui-icon layui-icon-ok"></i>
|
|
提交
|
|
</button>
|
|
<button type="reset" class="pear-btn pear-btn-sm">
|
|
<i class="layui-icon layui-icon-refresh"></i>
|
|
重置
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</form>
|
|
<script src="../../../component/layui/layui.js"></script>
|
|
<script src="../../../component/pear/pear.js"></script>
|
|
<script src="../../../component/pear/xm-select.js"></script>
|
|
<script>
|
|
layui.use(['form', 'jquery', 'laytpl', 'laydate'], function () {
|
|
var form = layui.form;
|
|
var $ = layui.jquery;
|
|
var laytpl = layui.laytpl
|
|
var laydate = layui.laydate;
|
|
|
|
var json = [
|
|
{
|
|
"children": [
|
|
{
|
|
"children": [],
|
|
"group_code": "yw",
|
|
"group_name": "语文",
|
|
"id": 2,
|
|
"name": "语文",
|
|
"parent_id": 1,
|
|
"subject_code": "dayuwen"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "yw",
|
|
"group_name": "语文",
|
|
"id": 3,
|
|
"name": "民族语文(朝语文+汉语文)",
|
|
"parent_id": 1,
|
|
"subject_code": "hanyuwen"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "yw",
|
|
"group_name": "语文",
|
|
"id": 4,
|
|
"name": "民族语文(蒙语文+汉语文)",
|
|
"parent_id": 1,
|
|
"subject_code": "mengyuwen"
|
|
}
|
|
],
|
|
"group_code": "yw",
|
|
"group_name": "语文",
|
|
"id": 1,
|
|
"name": "语文",
|
|
"parent_id": -1,
|
|
"subject_code": "yuwen"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "sx",
|
|
"group_name": "数学",
|
|
"id": 5,
|
|
"name": "数学",
|
|
"parent_id": -1,
|
|
"subject_code": "shuxue"
|
|
},
|
|
{
|
|
"children": [
|
|
{
|
|
"children": [],
|
|
"group_code": "wy",
|
|
"group_name": "外语",
|
|
"id": 7,
|
|
"name": "英语",
|
|
"parent_id": 6,
|
|
"subject_code": "yingyu"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "wy",
|
|
"group_name": "外语",
|
|
"id": 8,
|
|
"name": "日语",
|
|
"parent_id": 6,
|
|
"subject_code": "riyu"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "wy",
|
|
"group_name": "外语",
|
|
"id": 9,
|
|
"name": "俄语",
|
|
"parent_id": 6,
|
|
"subject_code": "eyu"
|
|
}
|
|
],
|
|
"group_code": "wy",
|
|
"group_name": "外语",
|
|
"id": 6,
|
|
"name": "外语",
|
|
"parent_id": -1,
|
|
"subject_code": "waiyu"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "wl",
|
|
"group_name": "物理",
|
|
"id": 10,
|
|
"name": "物理",
|
|
"parent_id": -1,
|
|
"subject_code": "wuli"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "hx",
|
|
"group_name": "化学",
|
|
"id": 11,
|
|
"name": "化学",
|
|
"parent_id": -1,
|
|
"subject_code": "huaxue"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "sw",
|
|
"group_name": "生物",
|
|
"id": 12,
|
|
"name": "生物",
|
|
"parent_id": -1,
|
|
"subject_code": "shengwu"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "zz",
|
|
"group_name": "政治",
|
|
"id": 13,
|
|
"name": "政治",
|
|
"parent_id": -1,
|
|
"subject_code": "zhengzhi"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "ls",
|
|
"group_name": "历史",
|
|
"id": 14,
|
|
"name": "历史",
|
|
"parent_id": -1,
|
|
"subject_code": "lishi"
|
|
},
|
|
{
|
|
"children": [],
|
|
"group_code": "dl",
|
|
"group_name": "地理",
|
|
"id": 15,
|
|
"name": "地理",
|
|
"parent_id": -1,
|
|
"subject_code": "dili"
|
|
}
|
|
]
|
|
|
|
var testTpl = testScript.innerHTML;
|
|
var testView = document.getElementById('testView');
|
|
laytpl(testTpl).render(json, function (html) {
|
|
testView.innerHTML = html;
|
|
});
|
|
|
|
form.render();
|
|
|
|
form.on('submit(save)', function (data) {
|
|
|
|
for (var key in data.field) {
|
|
var name = findName(json, data.field[key]);
|
|
console.log(name);
|
|
}
|
|
|
|
// console.log(data.field)
|
|
|
|
return false;
|
|
});
|
|
|
|
|
|
form.on('checkbox(childChk)', function (data) {
|
|
var elemId = data.elem.id.replace("chk_", "");
|
|
if (data.elem.checked) {
|
|
$("input[name='" + elemId + "']:first").prop("checked", "checked");
|
|
} else {
|
|
$("input[name='" + elemId + "']:checked").prop("checked", false);
|
|
}
|
|
form.render();
|
|
});
|
|
|
|
form.on('radio(childRdo)', function (data) {
|
|
var elemId = data.elem.id.replace("rdo_", "");
|
|
$("#chk_" + elemId).prop('checked', true)
|
|
form.render();
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
function findName(arr, code) {
|
|
for (let i = 0; i < arr.length; i++) {
|
|
if (arr[i].subject_code === code) {
|
|
return arr[i].name;
|
|
}
|
|
else if (arr[i].children) {
|
|
let found = findName(arr[i].children, code);
|
|
if (found) return found;
|
|
}
|
|
}
|
|
}
|
|
|
|
function getName(arr,name) {
|
|
var obj = arr.find(function (item) {
|
|
if (item.children) {
|
|
return item.children.some(function (child) {
|
|
return child.subject_code === name;
|
|
});
|
|
} else {
|
|
return item.subject_code === name;
|
|
}
|
|
});
|
|
|
|
var subject_name = obj.name;
|
|
|
|
return subject_name;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html> |