<div class="form-group"> <label class="control-label col-xs-12 col-sm-2">發送者:</label> <div class="col-xs-12 col-sm-8"> {:build_select('row[sender]', $senders, null, ['class'=>'form-control selectpicker sender', 'data-rule'=>'required'])} </div> </div> <div class="form-group"> <label class="control-label col-xs-12 col-sm-2">{:__('External_userid')}:</label> <div class="col-xs-12 col-sm-8"> <select id="c-external_userid" class="form-control selectpicker" name="row[external_userid]"> <option value="0" id="external_userid">請選擇</option> </select> </div> </div>
1.build_select是框架內置的函數,$senders為數據集
$('.sender').on('changed.bs.select', function() {//單擊時方法 // console.log('agja'); var ids = $(this).val(); console.log($('.sender').selectpicker('val')); $.post('qywx.gmsglog/getFollowUser', { 'userid':ids }, function (data) { $('#c-external_userid').html(""); for(var i in data){ $('#c-external_userid').append('<option value="'+data[i]+'">'+data[i]+'</option>') } $('select').selectpicker('refresh'); } ); });
1.當第一個select點擊選擇時候,通過jq監聽拿到數據,傳送給后台接口
public function getFollowUser() { $userid = $this->request->post('userid'); $external_userids = Db::name('qywx_resident_follow_user')->field('external_userid')->where('userid', $userid)->select()->toArray(); $external_userids = array_column($external_userids, 'external_userid'); $external_userids = array_combine($external_userids, $external_userids); return json($external_userids); }
1.通過json返回數據
思考:
1.定義兩個下拉選擇框,通過事件進行關聯,拿到第一個下拉框的id傳送給后台,拿到數據
2.每次點擊的時候需要清空之前的option
3.$('select').selectpicker('refresh');刷新一下select,重新加載append數據
4.select加multiple=""屬性為多選