选择自定义下拉列表,使用"输入"和" ul li"元件。
当按下li元素时,li的值设置为输入,但不会发生过滤。当我写入"输入"手动一切正常
如何设置数据输入?
HTML
<div class="drop-down-input select-style-input selected">
<input ng-model="keyword.classname" id="simple_2" class="drop-down-select" placeholder="input text" type="text">
<ul class="dropdown-list" style="display: none;">
<li ng-repeat="feedback in feedbacks">{{feedback.classname}}</li>
</ul>
</div>
<div class="feedback-container">
<div ng-repeat="feedback in feedbacks | filter:keyword" class="feedback-row gt-clear group group-content">
<div class="gt-left">
<div class="ava-round-small"></div>
</div>
<div class="gt-left right-side-fcontent">
<div class="students-name"> {{feedback.username}}</div>
<div class="text-feedback">{{feedback.feedback}}</div>
<div class="feedback-img">
<img src="#" width="100" height="100">
</div>
</div>
</div>
</div>
我的JS
$(function() {
$('.drop-down-input').click(function() {
$('.drop-down-input.selected').removeClass('selected'); // Forget the previous selection
$(this).addClass('selected');
$(this).find(".dropdown-list").show();
});
$(document).on("click", ".drop-down-input.selected li",
function(e) {
e.stopPropagation();
$('.drop-down-input.selected .dropdown-list').hide().siblings().val($(this).html());
});
});
$(document).mouseup(function (e){
var container = $(".dropdown-list");
if (!container.is(e.target)
&& container.has(e.target).length === 0)
{
container.hide();
}
});