# 112 Search input for TreeWidget
* adds search input field for js-filtering by input
This commit is contained in:
parent
6d5e2b8d15
commit
1ea5b4fc39
@ -1,3 +1,9 @@
|
|||||||
|
{% load i18n %}
|
||||||
|
|
||||||
|
<div class="ml-4 mb-4">
|
||||||
|
<input id="tree-search-input" class="form-control" type="text" placeholder="{% trans 'Search' %}"/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="tree-root">
|
<div id="tree-root">
|
||||||
{% include 'konova/widgets/checkbox-tree-select-content.html' %}
|
{% include 'konova/widgets/checkbox-tree-select-content.html' %}
|
||||||
</div>
|
</div>
|
||||||
@ -31,6 +37,22 @@
|
|||||||
toggleSelectedCssClass(this);
|
toggleSelectedCssClass(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function searchInputHandler(event){
|
||||||
|
var elem = $(this);
|
||||||
|
var val = elem.val()
|
||||||
|
var allTreeElements = $(".tree-element")
|
||||||
|
var allTreeElementsContain = $(".tree-element:contains(" + val + ")")
|
||||||
|
if(val.length > 0){
|
||||||
|
allTreeElements.hide()
|
||||||
|
allTreeElementsContain.show()
|
||||||
|
}else{
|
||||||
|
allTreeElements.show()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add event listener on search input
|
||||||
|
$("#tree-search-input").keyup(searchInputHandler)
|
||||||
|
|
||||||
// Add event listener on changed checkboxes
|
// Add event listener on changed checkboxes
|
||||||
$(".tree-input").change(changeHandler);
|
$(".tree-input").change(changeHandler);
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user