
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>表单select多选和无限级联动</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<title>城市选择器</title>
	<link rel="stylesheet"
		  href="<?= RESOURCES ?>/layuiadmin/layuiadmin/layui/css/layui.css"
		  media="all">
	<link rel="stylesheet"
		  href="<?= RESOURCES ?>/layuiadmin/layuiadmin/style/admin.css"
		  media="all">
	<style>
		#btn-wrap{margin:100px auto;text-align:center;}
		form{
			margin:30px;
		}
		html {
			background-color: #ffffff;
			color: #666;
		}
		form {
			margin: 0px;
		}
	</style>
</head>
<body>
<form class="layui-form" method="post">

	<div class="layui-form-item">

		<div id="cat_ids2"></div>
	</div>


	<!--  <div class="layui-form-item" style="text-align:center;">
       <div class="layui-input-block">
         <button type="button" class="layui-btn" lay-submit="" lay-filter="demo">console.log</button>
         <button type="reset" class="layui-btn layui-btn-primary">重置</button></div>
     </div> -->
</form>



<script src="<?= RESOURCES ?>/layuiadmin/layuiadmin/layui/layui.js"></script>

<script>

	var catData = <?=$filedValList?>;

	layui.config({
		base : '<?= RESOURCES ?>/layuiadmin/layuiadmin/'
	}).extend({
		selectN: 'layui_extends/selectN',
		selectM: 'layui_extends/selectM',
	}).use(['layer','form','jquery','selectN','selectM' ],function(){
		$ = layui.jquery;
		var form = layui.form
				,selectN = layui.selectN
				,selectM = layui.selectM;

		var selected=[];
		var selectValue='<?=$Parentids?>';
		selected = selectValue.split(',');

		//无限级分类-所有配置
		var catIns2 = selectN({
			//元素容器【必填】
			elem: '#cat_ids2'
			,search:[true,true]
			//候选数据【必填】
			,data: catData
			//设置了长度
			,width:null
			//默认值
			,selected: selected

			//为真只取最后一个值
			,last:true

			//空值项提示，可设置为数组['请选择省','请选择市','请选择县']
			,tips: '请选择'

			//事件过滤器，lay-filter名 不设置与选择器相同(去#.)
			,filter: ''

			//input的name 不设置与选择器相同(去#.)
			,name: 'cat2'

			//数据分隔符
			,delimiter: ','

			//数据的键名
			,field:{idName:'id',titleName:'name',childName:'child'}

			//表单区分 form.render(type, filter); 为class="layui-form" 所在元素的 lay-filter="" 的值
			,formFilter: null

		});

		myformSubmit = function(){
			//console.log('catIns1 当前选中的值：',catIns2.values);

			//获取父框架的元素
			var _ghyOb1=$('#<?php echo $_GET["field"]?>', window.parent.document);
			if(catIns2.lastValue!=""){
				_ghyOb1.val(catIns2.lastValue);
			}else{
				//选中第一个
				var  selectes_values_list= catIns2.values;
				if(selectes_values_list.length>0){
					var _value = selectes_values_list[selectes_values_list.length-2];
					_ghyOb1.val(_value);
				}

			}

		}



		window.setInterval("myformSubmit()", 200);
		/*  form.on('submit(demo)',function(data){
           console.log('catIns1 当前选中的值名：',catIns2.selected);
           console.log('catIns1 当前选中的值：',catIns2.values);
           console.log('catIns1 当前选中的名：',catIns2.names);
           console.log('catIns1 当前最后一个选中值：',catIns2.lastValue);
           console.log('catIns1 当前最后一个选中名：',catIns2.lastName);
           console.log('catIns1 当前最后一个是否已选：',catIns2.isSelected);
           console.log('');

           var formData = data.field;
           console.log('表单对象：',formData);
         }) */



	});






</script>



</body>
</html>
