fastadmin自定义下拉多级联动,当选用户组为渠道商就显示二级下拉列表,选其它的就隐藏二级下拉列表,这里提供了一个非常好的例子,基于官方风格。
	
一、页面

	1、add.html
	
		<!-- 第一个下拉框 -->
		<div class="form-group">
			<label class="control-label col-xs-12 col-sm-2">{:__('用户组')}:</label>
			<div class="col-xs-12 col-sm-8">
				<input id="c-group_id" data-rule="required" data-source="user/group/index" data-primary-key="id" class="form-control selectpage" name="row[group_id]" type="text" value="">
			</div>
		</div>
		
		<!-- 第二个下拉框 -->
		<div class="form-group" id="dealer-group" style="display: none;">
			<label class="control-label col-xs-12 col-sm-2">{:__('所属经销商')}:</label>
			<div class="col-xs-12 col-sm-8">
				<input id="c-parent_id" data-rule="required" data-source="user/user/index" data-field="mobile" class="form-control selectpage" name="row[parent_id]" type="text" value="0">
			</div>
		</div>	
	
	
	2、edit.html (区别在于添加判断:{if $row.parent_id<1} style="display: none;" {/if} )
	
		<!-- 第一个下拉框 -->
		<div class="form-group">
			<label class="control-label col-xs-12 col-sm-2">{:__('用户组')}:</label>
			<div class="col-xs-12 col-sm-8">			
				<input id="c-group_id" data-rule="required" data-source="user/group/index" data-primary-key="id" class="form-control selectpage" name="row[group_id]" type="text" value="{$row.group_id|htmlentities}">
			</div>
		</div>
		
		<!-- 第二个下拉框 -->
		<div class="form-group" id="dealer-group" {if $row.parent_id<1} style="display: none;" {/if}>
			<label class="control-label col-xs-12 col-sm-2">{:__('所属经销商')}:</label>
			<div class="col-xs-12 col-sm-8">
				<input id="c-parent_id" data-rule="required" data-source="user/user/index" data-field="mobile" class="form-control selectpage" name="row[parent_id]" type="text" value="{$row.parent_id|htmlentities}">
			</div>
		</div>	
	


二、js
	\public\assets\js\backend\你的.js (比如我的是:\public\assets\js\backend\user.js) 修改里面的 add 和 edit 方法即可
	
	
	
	1、针对 add.html的js

		add: function () {
			
			
			// 监听用户组下拉框变化事件
			$("#c-group_id").on('change', function() {
				var title = $(this).val();//获取标题
				var groupId = $('#c-group_id').val();//获id值				
				if(title=='渠道商'){//显示				
					$('#dealer-group').show();
					$('#c-parent_id').attr('value','');//默认不选下拉经销商是提交不了的
				}else{//隐藏
					$('#dealer-group').hide()
					$('#c-parent_id').attr('value',0);//其它的默认设置为0,要不然添加时是不能为空的。
				}				
			});
			
			// 监听 所属经销商 下接列表的 选中值
			$("#c-parent_id").data("params",function(e){
				//return {custom: {parent_id: $("#c-group_id").val()}};
				//return {group_id:2};
				return {group_id:$("#c-group_id").val()};
			})
			
			Controller.api.bindevent();
		},
	
	
	2、针对 edit.html的js
	
		edit: function () {
			
			// 监听用户组下拉框变化事件
			$("#c-group_id").on('change', function() {
				var title = $(this).val();//获取标题
				var groupId = $('#c-group_id').val();//获id值				
				if(title=='渠道商'){//显示				
					$('#dealer-group').show();
					$('#c-parent_id').attr('value','');//默认不选下拉经销商是提交不了的
				}else{//隐藏
					$('#dealer-group').hide()
					$('#c-parent_id').attr('value',0);//其它的默认设置为0,要不然添加时是不能为空的。
				}				
			});
			
			// 监听 所属经销商 下接列表的 选中值
			$("#c-parent_id").data("params",function(e){
				//return {custom: {parent_id: $("#c-group_id").val()}};
				//return {group_id:2};
				return {group_id:$("#c-group_id").val()};
			})
			
			Controller.api.bindevent();
		},
		


三、后台代码
	
	\admin\controller\user\你的.php (比如我的是:\admin\controller\user\User.php) 修改里面的 index 方法,添加二级联动查询条件即可。 我的接口是上面html代码中的:user/user/index
	
	/**
	 * 查看
	 */
	public function index()
	{
		//设置过滤方法
		$this->request->filter(['strip_tags', 'trim']);
		if ($this->request->isAjax()) {
			
			//二级联动
			$custom = $this->request->param();			
			if(!empty($custom['group_id'])){
				//如果发送的来源是Selectpage,则转发到Selectpage - 让下拉在修改的时候选中指定数据库中的值
				if ($this->request->request('keyField')) {
					return $this->selectpage();
				}
				list($where, $sort, $order, $offset, $limit) = $this->buildparams();					
				if($custom['group_id']==3){//如果是渠道商才会有值
				
					$where=[];			
					$where['parent_id']=0;//!empty($custom['parent_id']) ? $custom['parent_id'] : 0;					
					$where['group_id']=2;//查经销商
					$list = $this->model    
					->where($where)    
					->order($sort, $order)
					->paginate(5);
					$result = array("total" => $list->total(), "rows" => $list->items());
					return json($result);
				}else{
					$result = array("total" => 0, "rows" => []);
					return json($result);
				}
			}
			
			//如果发送的来源是Selectpage,则转发到Selectpage
			if ($this->request->request('keyField')) {
				return $this->selectpage();
			}
			list($where, $sort, $order, $offset, $limit) = $this->buildparams();
			$list = $this->model
				->with('group')
				->where($where)
				->order($sort, $order)
				->paginate($limit);
			foreach ($list as $k => $v) {
				$v->avatar = $v->avatar ? cdnurl($v->avatar, true) : letter_avatar($v->nickname);
				$v->hidden(['password', 'salt']);
			}
			$result = array("total" => $list->total(), "rows" => $list->items());

			return json($result);
		}
		return $this->view->fetch();
	}


点赞(0) 打赏

评论列表 共有 0 条评论

暂无评论

微信小程序

微信扫一扫体验

立即
投稿

微信公众账号

微信扫一扫加关注

发表
评论
返回
顶部
{__SCRIPT__}