diff --git a/src/main/twirl/gitbucket/core/dashboard/header.scala.html b/src/main/twirl/gitbucket/core/dashboard/header.scala.html
index bc174bc..1568f63 100644
--- a/src/main/twirl/gitbucket/core/dashboard/header.scala.html
+++ b/src/main/twirl/gitbucket/core/dashboard/header.scala.html
@@ -18,7 +18,7 @@
       </a>
     </li>
   }
-  @gitbucket.core.helper.html.dropdown("Organization"){
+  @gitbucket.core.helper.html.dropdown("Organization", filter = ("organization", "Find Organization...")){
     @groups.map { group =>
       <li>
         <a href="@((if(condition.groups.contains(group)) condition.copy(groups = condition.groups - group) else condition.copy(groups = condition.groups + group)).toURL)">
@@ -60,4 +60,4 @@
       </a>
     </li>
   }
-</div>
\ No newline at end of file
+</div>
diff --git a/src/main/twirl/gitbucket/core/issues/listparts.scala.html b/src/main/twirl/gitbucket/core/issues/listparts.scala.html
index fb0ec7e..034aa84 100644
--- a/src/main/twirl/gitbucket/core/issues/listparts.scala.html
+++ b/src/main/twirl/gitbucket/core/issues/listparts.scala.html
@@ -27,7 +27,7 @@
       <th style="background-color: #eee;">
         <input type="checkbox"/>
         <span id="table-issues-control">
-          @gitbucket.core.helper.html.dropdown("Author") {
+          @gitbucket.core.helper.html.dropdown("Author", filter = ("author", "Find Author...")) {
             @collaborators.map { collaborator =>
               <li>
                 <a href="@condition.copy(author = (if(condition.author == Some(collaborator)) None else Some(collaborator))).toURL">
@@ -37,7 +37,7 @@
               </li>
             }
           }
-          @gitbucket.core.helper.html.dropdown("Label") {
+          @gitbucket.core.helper.html.dropdown("Label", filter = ("label", "Find Label...")) {
             @labels.map { label =>
               <li>
                 <a href="@condition.copy(labels = (if(condition.labels.contains(label.labelName)) condition.labels - label.labelName else condition.labels + label.labelName)).toURL">
@@ -48,7 +48,7 @@
               </li>
             }
           }
-          @gitbucket.core.helper.html.dropdown("Milestone") {
+          @gitbucket.core.helper.html.dropdown("Milestone", filter = ("milestone", "Find Milestone...")) {
             <li>
               <a href="@condition.copy(milestone = (if(condition.milestone == Some(None)) None else Some(None))).toURL">
                 @gitbucket.core.helper.html.checkicon(condition.milestone == Some(None)) Issues with no milestone
@@ -62,7 +62,7 @@
               </li>
             }
           }
-          @gitbucket.core.helper.html.dropdown("Assignee") {
+          @gitbucket.core.helper.html.dropdown("Assignee", filter = ("assignee", "Find Assignee...")) {
             <li>
               <a href="@condition.copy(assigned = (if(condition.assigned == Some(None)) None else Some(None))).toURL">
                 @gitbucket.core.helper.html.checkicon(condition.assigned == Some(None)) Assigned to nobody
@@ -116,7 +116,7 @@
               <li><a href="javascript:void(0);" class="toggle-state" data-id="open">Open</a></li>
               <li><a href="javascript:void(0);" class="toggle-state" data-id="close">Close</a></li>
             }
-            @gitbucket.core.helper.html.dropdown("Label") {
+            @gitbucket.core.helper.html.dropdown("Label", filter = ("label", "Find Label...")) {
               @labels.map { label =>
                 <li>
                   <a href="javascript:void(0);" class="toggle-label" data-id="@label.labelId">
@@ -127,13 +127,13 @@
                 </li>
               }
             }
-            @gitbucket.core.helper.html.dropdown("Milestone") {
+            @gitbucket.core.helper.html.dropdown("Milestone", filter = ("milestone", "Find Milestone...")) {
               <li><a href="javascript:void(0);" class="toggle-milestone" data-id="">No milestone</a></li>
               @milestones.filter(_.closedDate.isEmpty).map { milestone =>
                 <li><a href="javascript:void(0);" class="toggle-milestone" data-id="@milestone.milestoneId">@milestone.title</a></li>
               }
             }
-            @gitbucket.core.helper.html.dropdown("Assignee") {
+            @gitbucket.core.helper.html.dropdown("Assignee", filter = ("assignee", "Find Assignee...")) {
               <li><a href="javascript:void(0);" class="toggle-assign" data-name=""><i class="octicon octicon-x"></i> Clear assignee</a></li>
               @collaborators.map { collaborator =>
                 <li><a href="javascript:void(0);" class="toggle-assign" data-name="@collaborator"><i class="octicon"></i>@helpers.avatar(collaborator, 20) @collaborator</a></li>
diff --git a/src/main/twirl/gitbucket/core/pulls/compare.scala.html b/src/main/twirl/gitbucket/core/pulls/compare.scala.html
index 17a399a..714f324 100644
--- a/src/main/twirl/gitbucket/core/pulls/compare.scala.html
+++ b/src/main/twirl/gitbucket/core/pulls/compare.scala.html
@@ -20,23 +20,23 @@
   @gitbucket.core.html.menu("pulls", repository){
     <div class="pullreq-info">
       <div id="compare-edit">
-        @gitbucket.core.helper.html.dropdown(originRepository.owner + "/" + originRepository.name, "base fork") {
+        @gitbucket.core.helper.html.dropdown(originRepository.owner + "/" + originRepository.name, "base fork", filter=("origin_repo", "Find Repository...")) {
           @members.map { case (owner, name) =>
             <li><a href="#" class="origin-owner" data-owner="@owner" data-name="@name">@gitbucket.core.helper.html.checkicon(owner == originRepository.owner) @owner/@name</a></li>
           }
         }
-        @gitbucket.core.helper.html.dropdown(originId, "base") {
+        @gitbucket.core.helper.html.dropdown(originId, "base", filter=("origin_branch", "Find Branch...")) {
           @originRepository.branchList.map { branch =>
             <li><a href="#" class="origin-branch" data-branch="@helpers.encodeRefName(branch)">@gitbucket.core.helper.html.checkicon(branch == originId) @branch</a></li>
           }
         }
         ...
-        @gitbucket.core.helper.html.dropdown(forkedRepository.owner + "/" + forkedRepository.name, "head fork") {
+        @gitbucket.core.helper.html.dropdown(forkedRepository.owner + "/" + forkedRepository.name, "head fork", filter=("forked_repo", "Find Repository...")) {
           @members.map { case (owner, name) =>
             <li><a href="#" class="forked-owner" data-owner="@owner" data-name="@name">@gitbucket.core.helper.html.checkicon(owner == forkedRepository.owner) @owner/@name</a></li>
           }
         }
-        @gitbucket.core.helper.html.dropdown(forkedId, "compare") {
+        @gitbucket.core.helper.html.dropdown(forkedId, "compare", filter=("forked_branch", "Find Branch...")) {
           @forkedRepository.branchList.map { branch =>
             <li><a href="#" class="forked-branch" data-branch="@helpers.encodeRefName(branch)">@gitbucket.core.helper.html.checkicon(branch == forkedId) @branch</a></li>
           }
@@ -221,27 +221,3 @@
   }
 });
 </script>
-<script>
-  function dropdownFilter(dropdownItem,placeHolder,id) {
-    $('<li><input id="' + id + '" type="text" class="form-control input-sm dropdown-filter-input" placeholder="' + placeHolder + '"/></li>')
-      .insertBefore($("li:has(a" + dropdownItem + "):first"));
-    $('#'+id).keyup(function() {
-      var inputVal = $('#'+id).val();
-      $.each($('#'+id).parent().parent().find('a'), function(index, elem) {
-        if (!inputVal || !elem.text.trim() || elem.text.trim().toLowerCase().indexOf(inputVal.toLowerCase()) >= 0) {
-          $(elem).parent().show();
-        } else {
-          $(elem).parent().hide();
-        }
-      });
-    });
-  }
-
-  $(function(){
-    dropdownFilter('.origin-owner', 'Find Repository...', 'origin-owner-control-input');
-    dropdownFilter('.origin-branch','Find Branch...',     'origin-branch-control-input');
-    dropdownFilter('.forked-owner', 'Find Repository...', 'forked-owner-control-input');
-    dropdownFilter('.forked-branch','Find Branch...',     'forked-branch-control-input');
-  });
-</script>
-