导入系统dataImport前端（二级下拉列表）

我认为我需要对这个做一些总结：

 下面我将给出生成的代码：

        在这里，我不太方便写出我的pSYSJEJLXObj和cSYSJEJLXObj具体内容，如果您想做一个二级下拉列表，你是完全可以写一个你自己的字典。

<script>
         layui.config({
            base: "../static/layui/lay/mymodules/"
        }).use(['form',"jquery","cascader","form"], function(){
            var $ = layui.jquery;
            var cascader = layui.cascader;

			var pSYSJEJLXObj = {
			      "1101": "...数据",
      "1102": "...数据",
      "1103": "...数据",
      "1104": "...数据",
      "1105": "...数据",
      "1106": "...数据",
      "1107": "...数据"
			    }
			var arr = []
			var cSYSJEJLXObj = {
			      "110000": "...数据",
      "110100": "...数据",
      "110101": "...数据",
      "110102": "...数据",
      "110200": "...数据",
      "110201": "...数据",
      "110202": "...数据",
      "110300": "...数据",
				  }
            for (var k in pSYSJEJLXObj) {
				var firstObj={
                    value: k,
                    label: pSYSJEJLXObj[k],
                    children: []
                }

				for (var i in cSYSJEJLXObj) {
					var secondObj ={
                    value: i,
                    label: cSYSJEJLXObj[i]
                }
				var leng = k.length
				var cp = i.substring(0,leng)
					if(cp ==k){
						firstObj.children.push(secondObj)

					}
					if(k=="1101"&&i=='110000'){
						firstObj.children.push(secondObj)
					}
				}
				arr.push(firstObj)
            }

            var cas=cascader({
                elem: "#layui_select",
                data: arr,
                value: ["1101", "110000",],
                // changeOnSelect: true,-+
                success: function (valData,labelData) {
                    console.log("======================")
                    console.log(arr)
                    console.log("======================")
                    console.log(valData,labelData);
                    $('input[name="leiXingP"]').val(valData[0])
                    $('input[name="leiXingC"]').val(valData[1])
                }
            });
            var reloadData=[
                {
                    value: 'A',
                    label: 'a',
                    children: [
                        {
                            value: 'AA1',
                            label: 'aa1',
                        },
                        {
                            value: 'BB1',
                            label: 'bb1'
                        }
                    ]
                }
            ]
            $(".layui-btn").on("click",function() {
                cas.reload({
                    data: reloadData,
                    value:['A','BB1']
                })
            })

        });
    </script>

 因为我想获取二级列表中所选择的内容，所以我做了如下操作，直接看代码：

<div id="rawdataUploader" style="margin-top: 20px" >
    <h4 style="float: left;margin-top: 20px">试验原始数据文件</h4>
    </br>
    <span style="float: left;visibility: hidden"> tab </span>
    <button style="float: left;margin-bottom: 15px;font-size:14px" id="rawdatabrowse" class="btn btn-primary btn-sm ">选择文件</button>
    <select style="margin-bottom: 15px;font-size:14px" class="secret" id="rawdata-secret"> </select>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <input type="text" id="layui_select" class="layui-input" readonly="readonly">
        </div>
    </div>

    <input type="hidden" name="leiXingP">
    <input type="hidden" name="leiXingC">
    <table class="table table-bordered" id="rawdata-uploadTable">
        <thead id="test_raw_data" style="background-color: #CDCDCD">
        <tr>
            <td>文件名称</td>
            <td>文件大小</td>
            <td>上传进度</td>
            <td>删除</td>
        </tr>
        </thead>
    </table>
</div>

 将获取到的二级下拉框的值post到导入系统的后台：class1和class2

{## // 如果上传了原始数据文件的话 //#}
if (rawdata_uploader.files.length > 0) {
    for (o = 0; o < rawdata_uploader.files.length; o++){
         $.post("assign",
            {
                id: id,
                {##xjy create#}
                task_json:task_json,
                rawdata: $("#rawdata-secret").find("option:selected").val(),
                class1: $('input[name="leiXingP"]').val(),
                class2: $('input[name="leiXingC"]').val(),
                file_name : rawdata_uploader.files[o].name,
                file_size : rawdata_uploader.files[o].size,
                department_id : getCookie('department'),
                department_name: getCookie('departmentName')
                {#xjy end#}
            })
    }

    console.log("class1 is:")
    console.log($('input[name="leiXingC"]').val())
    console.log('rawdata_uploader.files[0].name')
    console.log(rawdata_uploader.files[0].name)
}