diff --git a/app/Http/Controllers/Api/ProjectLabelTreeController.php b/app/Http/Controllers/Api/ProjectLabelTreeController.php
index 1a57fbc08..2ada7fd92 100644
--- a/app/Http/Controllers/Api/ProjectLabelTreeController.php
+++ b/app/Http/Controllers/Api/ProjectLabelTreeController.php
@@ -59,13 +59,13 @@ public function index($id)
     }
 
     /**
-     * Display all label trees that can be used by the specified project.
+     * Display label trees that match the given name and can be used by the specified project.
      *
-     * @api {get} projects/:id/label-trees/available Get all available label trees
+     * @api {get} projects/:id/label-trees/available/:name Get matching label trees
      * @apiGroup Projects
      * @apiName IndexProjectAvailableLabelTrees
      * @apiPermission projectMember
-     * @apiDescription This endpoint lists all label trees that _can be_ used by the project (do not confuse this with the "used label trees" endpoint).
+     * @apiDescription This endpoint lists all matching label trees that _can be_ used by the project (do not confuse this with the "used label trees" endpoint).
      *
      * @apiParam {Number} id The project ID.
      *
@@ -86,19 +86,22 @@ public function index($id)
      * ]
      *
      * @param int $id Project ID
+     * @param string $name Labeltree name
      * @return array<int, LabelTree>
      */
-    public function available($id)
+    public function available($id, $name)
     {
         $project = Project::findOrFail($id);
         $this->authorize('access', $project);
 
         $public = LabelTree::publicTrees()
             ->select('id', 'name', 'description', 'version_id')
+            ->where('name', 'ilike', "%{$name}%")
             ->with('version')
             ->get();
         $authorized = $project->authorizedLabelTrees()
             ->select('id', 'name', 'description', 'version_id')
+            ->where('name', 'ilike', "%{$name}%")
             ->with('version')
             ->get();
 
diff --git a/app/Http/Controllers/Api/ProjectsAttachableVolumesController.php b/app/Http/Controllers/Api/ProjectsAttachableVolumesController.php
index 70232d8e8..bc9cfb47a 100644
--- a/app/Http/Controllers/Api/ProjectsAttachableVolumesController.php
+++ b/app/Http/Controllers/Api/ProjectsAttachableVolumesController.php
@@ -10,14 +10,14 @@
 class ProjectsAttachableVolumesController extends Controller
 {
     /**
-     * Shows all volumes that can be attached to the project by the requesting user.
+     * Shows volumes that match the given volume name and can be attached to the project by the requesting user.
      *
-     * @api {get} projects/:id/attachable-volumes Get attachable volumes
+     * @api {get} projects/:id/attachable-volumes/:name Get matching attachable volumes
      * @apiGroup Projects
      * @apiName IndexAttachableVolumes
      * @apiPermission projectAdmin
      * @apiParam {Number} id ID of the project for which the volumes should be fetched.
-     * @apiDescription A list of all volumes where the requesting user has admin rights for (excluding those already belonging to the specified project).
+     * @apiDescription A list of all matching volumes where the requesting user has admin rights for (excluding those already belonging to the specified project).
      *
      * @apiSuccessExample {json} Success response:
      * [
@@ -34,10 +34,11 @@ class ProjectsAttachableVolumesController extends Controller
      *
      * @param Request $request
      * @param int $id Project ID
+     * @param string $name Volume name
      *
      * @return \Illuminate\Database\Eloquent\Collection
      */
-    public function index(Request $request, $id)
+    public function index(Request $request, $id, $name)
     {
         $project = Project::findOrFail($id);
         $this->authorize('update', $project);
@@ -56,6 +57,7 @@ public function index(Request $request, $id)
                             ->where('project_id', '!=', $id);
                     });
             })
+            ->where('name', 'ilike', "%{$name}%")
             // Do not return volumes that are already attached to this project.
             // This is needed although we are already excluding the project in the
             // previous statement because other projects may already share volumes with
diff --git a/resources/assets/js/core/api/projects.js b/resources/assets/js/core/api/projects.js
index 41a4e47ca..3c2b9f6c4 100644
--- a/resources/assets/js/core/api/projects.js
+++ b/resources/assets/js/core/api/projects.js
@@ -86,7 +86,7 @@ export default Vue.resource('api/v1/projects{/id}', {}, {
     },
     queryAvailableLabelTrees: {
         method: 'GET',
-        url: 'api/v1/projects{/id}/label-trees/available',
+        url: 'api/v1/projects{/id}/label-trees/available{/name}',
     },
     attachLabelTree: {
         method: 'POST',
diff --git a/resources/assets/js/core/components/typeahead.vue b/resources/assets/js/core/components/typeahead.vue
index 7f514f350..7c9818140 100644
--- a/resources/assets/js/core/components/typeahead.vue
+++ b/resources/assets/js/core/components/typeahead.vue
@@ -4,6 +4,7 @@
         ref="input"
         class="form-control"
         type="text"
+        v-model="inputText"
         :disabled="disabled"
         :placeholder="placeholder"
         @focus="emitFocus"
@@ -15,11 +16,15 @@
         :target="inputElement"
         :data="items"
         :force-select="true"
-        :limit="limit"
+        :limit="itemLimit"
+        :class="{'typeahead-scrollable': scrollable}"
         item-key="name"
+        v-show="showTypeahead"
+        @selected-item-changed="handleArrowKeyScroll"
         >
         <template slot="item" slot-scope="props">
             <component
+                ref="dropdown"
                 :is="itemComponent"
                 @click.native="emitInternalValue"
                 v-for="(item, index) in props.items"
@@ -38,6 +43,7 @@
 <script>
 import Typeahead from 'uiv/dist/Typeahead';
 import TypeaheadItem from './typeaheadItem';
+import {debounce} from './../utils';
 
 /**
  * A component that displays a typeahead to find items.
@@ -81,17 +87,33 @@ export default {
             type: Object,
             default: () => TypeaheadItem,
         },
+        scrollable: {
+            type: Boolean,
+            default: false,
+        },
     },
     data() {
         return {
             inputElement: null,
             internalValue: undefined,
+            inputText: '',
+            isTyping: false,
+            oldInput: '',
+            maxItemCount: 50
         };
     },
+    computed: {
+        itemLimit() {
+            return this.scrollable ? this.maxItemCount : this.limit
+        },
+        showTypeahead() {
+            return !this.scollable || this.scrollable && !this.isTyping;
+        }
+    },
     methods: {
         clear() {
             this.internalValue = undefined;
-            this.$refs.input.value = '';
+            this.inputText = '';
         },
         emitFocus(e) {
             this.$emit('focus', e);
@@ -108,11 +130,34 @@ export default {
                 }
             }
         },
+        handleArrowKeyScroll(index) {
+            if (this.scrollable && this.$refs.dropdown[index]) {
+                this.$refs.dropdown[index].$el.scrollIntoView({block: 'nearest'});
+            }
+        },
     },
     watch: {
         value(value) {
             this.internalValue = value;
         },
+        inputText(v) {
+            this.isTyping = true;
+            debounce(() => {
+                let added = v.trim().includes(this.oldInput.trim());
+                let useTypeaheadFilter = this.oldInput.length > 3 && added;
+                if (v.length >= 3 && !useTypeaheadFilter) {
+                    this.$emit('fetch', v);
+                }
+                this.isTyping = false;
+                this.oldInput = v
+            }, 500, 'typeahead-fetch');
+        },
+        disabled() {
+            // Use disabled and nextTick to show dropdown right after loading finished
+            if (!this.disabled) {
+                this.$nextTick(() => this.$refs.input.focus())
+            }
+        }
     },
     created() {
         this.internalValue = this.value;
diff --git a/resources/assets/js/core/components/typeaheadItem.vue b/resources/assets/js/core/components/typeaheadItem.vue
index 00adacfc7..1ad563227 100644
--- a/resources/assets/js/core/components/typeaheadItem.vue
+++ b/resources/assets/js/core/components/typeaheadItem.vue
@@ -1,7 +1,7 @@
 <template>
 <li>
     <a href="#" @click.prevent="props.select(item)">
-        <span v-html="props.highlight(item)"></span>
+        <span class="typeahead-item-name" v-html="props.highlight(item)" :title="item.name"></span>
         <span v-if="info">
             <br><small class="typeahead-item-info" v-text="info" :title="info"></small>
         </span>
@@ -36,7 +36,7 @@ export default {
             return keys.reduce(function (i, key) {
                 return i ? i[key] : i;
             }, this.item);
-        }
-    },
+        },
+    }
 };
 </script>
diff --git a/resources/assets/js/projects/api/attachableVolumes.js b/resources/assets/js/projects/api/attachableVolumes.js
index abb33ae33..e39a8fb1d 100644
--- a/resources/assets/js/projects/api/attachableVolumes.js
+++ b/resources/assets/js/projects/api/attachableVolumes.js
@@ -8,4 +8,4 @@
  * var resource = biigle.$require('api.attachableVolumes');
  * resource.get({id: projectId}).then(...);
  */
-export default Vue.resource('api/v1/projects{/id}/attachable-volumes');
+export default Vue.resource('api/v1/projects{/id}/attachable-volumes{/name}');
diff --git a/resources/assets/js/projects/labelTreesContainer.vue b/resources/assets/js/projects/labelTreesContainer.vue
index 808fe4bc9..a404792a0 100644
--- a/resources/assets/js/projects/labelTreesContainer.vue
+++ b/resources/assets/js/projects/labelTreesContainer.vue
@@ -3,8 +3,8 @@ import Events from '../core/events';
 import LabelTreeList from './components/labelTreeList';
 import LoaderMixin from '../core/mixins/loader';
 import ProjectsApi from '../core/api/projects';
-import Typeahead from '../core/components/typeahead';
 import {handleErrorResponse} from '../core/messages/store';
+import Typeahead from '../core/components/typeahead';
 
 export default {
     mixins: [LoaderMixin],
@@ -19,6 +19,7 @@ export default {
             labelTrees: [],
             fetchedAvailableLabelTrees: false,
             availableLabelTrees: [],
+            oldTreeName: "",
         };
     },
     computed: {
@@ -35,13 +36,16 @@ export default {
         },
     },
     methods: {
-        fetchAvailableLabelTrees() {
-            if (!this.fetchedAvailableLabelTrees) {
+        fetchAvailableLabelTrees(treeName) {
+            if (this.oldTreeName.trim() != treeName.trim()) {
                 this.fetchedAvailableLabelTrees = true;
                 this.startLoading();
-                ProjectsApi.queryAvailableLabelTrees({id: this.project.id})
+                ProjectsApi.queryAvailableLabelTrees({ id: this.project.id, name: treeName })
                     .then(this.availableLabelTreesFetched, handleErrorResponse)
-                    .finally(this.finishLoading);
+                    .finally(() => {
+                        this.finishLoading();
+                        this.oldTreeName = treeName;
+                    });
             }
         },
         availableLabelTreesFetched(response) {
diff --git a/resources/assets/js/projects/volumesContainer.vue b/resources/assets/js/projects/volumesContainer.vue
index f005e7299..8cffafdab 100644
--- a/resources/assets/js/projects/volumesContainer.vue
+++ b/resources/assets/js/projects/volumesContainer.vue
@@ -5,7 +5,7 @@ import LoaderMixin from '../core/mixins/loader';
 import PreviewThumbnail from './components/previewThumbnail';
 import statisticsModal from './components/statisticsModal';
 import ProjectsApi from '../core/api/projects';
-import Typeahead from '../core/components/typeahead';
+import Typeahead from '../core/components/typeahead.vue';
 import {handleErrorResponse} from '../core/messages/store';
 
 
@@ -37,13 +37,14 @@ export default {
             currentSorting: SORTING.DATE_DOWN,
             showModal: false,
             statisticsData: {},
-            volumeUrlTemplate: ""
+            volumeUrlTemplate: "",
+            oldVolumeName: "",
         };
     },
     components: {
         previewThumbnail: PreviewThumbnail,
-        typeahead: Typeahead,
-        statisticsModal: statisticsModal
+        statisticsModal: statisticsModal,
+        typeahead: Typeahead
     },
     computed: {
         sortedVolumes() {
@@ -195,12 +196,15 @@ export default {
                 }
             }
         },
-        fetchAttachableVolumes() {
-            if (!this.fetchedAttachableVolumes) {
+        fetchAttachableVolumes(volumeName) {
+            if (this.oldVolumeName.trim() != volumeName.trim()) {
                 this.fetchedAttachableVolumes = true;
                 this.startLoading();
-                AttachableVolumesApi.get({id: this.project.id})
-                    .then(this.attachableVolumesFetched, handleErrorResponse)
+                AttachableVolumesApi.get({ id: this.project.id, name: volumeName })
+                    .then((res) => {
+                        this.attachableVolumesFetched(res);
+                        this.oldVolumeName = volumeName;
+                    }, handleErrorResponse)
                     .finally(this.finishLoading);
             }
         },
diff --git a/resources/assets/sass/components/_typeahead.scss b/resources/assets/sass/components/_typeahead.scss
index 7a613acd1..e31f252b4 100644
--- a/resources/assets/sass/components/_typeahead.scss
+++ b/resources/assets/sass/components/_typeahead.scss
@@ -6,9 +6,14 @@
     display: block;
 }
 
-.typeahead-item-info {
+.typeahead-item-info, .typeahead-item-name {
     display: inline-block;
     max-width: 250px;
     text-overflow: ellipsis;
     overflow: hidden;
 }
+
+.typeahead-scrollable .dropdown-menu {
+    max-height: 200px;
+    overflow-y: auto;
+}
diff --git a/resources/views/projects/show/label-trees.blade.php b/resources/views/projects/show/label-trees.blade.php
index 5c78dcfb7..41ed6f12f 100644
--- a/resources/views/projects/show/label-trees.blade.php
+++ b/resources/views/projects/show/label-trees.blade.php
@@ -30,7 +30,7 @@
                 @can('update', $project)
                     <loader :active="loading"></loader>
                     <a href="{{route('label-trees-create', ['project' => $project->id])}}" class="btn btn-default" title="Create a new label tree and attach it to this project" >Create Label Tree</a>
-                    <typeahead :items="attachableLabelTrees" placeholder="Attach label tree" :disabled="loading" v-on:select="attachTree" :clear-on-select="true" more-info="description" title="Attach a label tree" v-on:focus="fetchAvailableLabelTrees"></typeahead>
+                    <typeahead :scrollable="true" :items="attachableLabelTrees" :disabled="loading" placeholder="Attach label tree" v-on:select="attachTree" :clear-on-select="true" more-info="description" title="Attach a label tree" v-on:fetch="fetchAvailableLabelTrees"></typeahead>
                 @else
                     <span class="text-muted">Project admins can add and remove label trees.</span>
                 @endcan
diff --git a/resources/views/projects/show/volumes.blade.php b/resources/views/projects/show/volumes.blade.php
index adfc34e7f..e5b5c5e05 100644
--- a/resources/views/projects/show/volumes.blade.php
+++ b/resources/views/projects/show/volumes.blade.php
@@ -30,7 +30,7 @@
             <span class="pull-right">
                 <loader :active="loading"></loader>
                 <a href="{{ route('create-volume') }}?project={{ $project->id }}" class="btn btn-default" title="Create a new volume for this project">Create Volume</a>
-                <typeahead :items="attachableVolumes" placeholder="Attach volumes" v-on:select="attachVolume" :clear-on-select="true" title="Attach existing volumes of other projects" v-on:focus="fetchAttachableVolumes"></typeahead>
+                <typeahead :scrollable="true" :disabled="loading" :items="attachableVolumes" placeholder="Attach volumes" v-on:select="attachVolume" :clear-on-select="true" title="Attach existing volumes of other projects" v-on:fetch="fetchAttachableVolumes"></typeahead>
             </span>
         @endcan
     </div>
diff --git a/routes/api.php b/routes/api.php
index 148d6b58a..1eae8ebf9 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -165,7 +165,7 @@
     'parameters' => ['projects' => 'id'],
 ]);
 
-$router->get('projects/{id}/attachable-volumes', 'ProjectsAttachableVolumesController@index');
+$router->get('projects/{id}/attachable-volumes/{name}', 'ProjectsAttachableVolumesController@index');
 
 $router->resource('projects.invitations', 'ProjectInvitationController', [
     'only' => ['store'],
@@ -173,7 +173,7 @@
 ]);
 
 $router->get(
-    'projects/{id}/label-trees/available',
+    'projects/{id}/label-trees/available/{name}',
     'ProjectLabelTreeController@available'
 );
 $router->resource('projects.label-trees', 'ProjectLabelTreeController', [
diff --git a/tests/php/Http/Controllers/Api/ProjectLabelTreeControllerTest.php b/tests/php/Http/Controllers/Api/ProjectLabelTreeControllerTest.php
index f52d2bed6..f8783bb21 100644
--- a/tests/php/Http/Controllers/Api/ProjectLabelTreeControllerTest.php
+++ b/tests/php/Http/Controllers/Api/ProjectLabelTreeControllerTest.php
@@ -41,23 +41,83 @@ public function testIndex()
     public function testAvailable()
     {
         $p = $this->project();
-        $private = LabelTreeTest::create(['visibility_id' => Visibility::privateId()]);
-        $authorized = LabelTreeTest::create(['visibility_id' => Visibility::privateId()]);
+
+        $private = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'Test']);
+        
+        $authorized = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'Test']);
         $authorized->authorizedProjects()->attach($p->id);
-        $public = LabelTreeTest::create(['visibility_id' => Visibility::publicId()]);
+        $authorized2 = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'Tree']);
+        $authorized2->authorizedProjects()->attach($p->id);
+        
+        $public = LabelTreeTest::create(['visibility_id' => Visibility::publicId(), 'name' => 'Test']);
+        $version = LabelTreeVersionTest::create();
+        $public->version_id = $version->id;
+        $public->save();
+        $public2 = LabelTreeTest::create(['visibility_id' => Visibility::publicId(), 'name' => 'Tree']);
+        $version2 = LabelTreeVersionTest::create();
+        $public2->version_id = $version2->id;
+        $public2->save();
+
+        $this->doTestApiRoute('GET', "/api/v1/projects/{$p->id}/label-trees/available/test");
+
+        $this->beUser();
+        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available/test");
+        $response->assertStatus(403);
+
+        $this->beGuest();
+        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available/test");
+        $response->assertStatus(200);
+        $this->assertCount(2, $response->decodeResponseJson());
+        $response->assertJsonFragment([[
+            'id' => $authorized->id,
+            'name' => $authorized->name,
+            'description' => $authorized->description,
+            'version' => null,
+        ]]);
+        $response->assertJsonFragment([[
+            'id' => $public->id,
+            'name' => $public->name,
+            'description' => $public->description,
+            'version' => $version->toArray(),
+        ]]);
+        $response->assertJsonMissing([[
+            'id' => $private->id,
+            'name' => $private->name,
+            'description' => $private->description,
+            'version' => null,
+        ]]);
+    }
+
+    public function testAvailableFuzzySearch()
+    {
+        $p = $this->project();
+
+        $private = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'My Test']);
+        
+        $authorized = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'My Test']);
+        $authorized->authorizedProjects()->attach($p->id);
+        $authorized2 = LabelTreeTest::create(['visibility_id' => Visibility::privateId(), 'name' => 'Tree']);
+        $authorized2->authorizedProjects()->attach($p->id);
+        
+        $public = LabelTreeTest::create(['visibility_id' => Visibility::publicId(), 'name' => 'My Test']);
         $version = LabelTreeVersionTest::create();
         $public->version_id = $version->id;
         $public->save();
+        $public2 = LabelTreeTest::create(['visibility_id' => Visibility::publicId(), 'name' => 'Tree']);
+        $version2 = LabelTreeVersionTest::create();
+        $public2->version_id = $version2->id;
+        $public2->save();
 
-        $this->doTestApiRoute('GET', "/api/v1/projects/{$p->id}/label-trees/available");
+        $this->doTestApiRoute('GET', "/api/v1/projects/{$p->id}/label-trees/available/test");
 
         $this->beUser();
-        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available");
+        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available/test");
         $response->assertStatus(403);
 
         $this->beGuest();
-        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available");
+        $response = $this->get("/api/v1/projects/{$p->id}/label-trees/available/test");
         $response->assertStatus(200);
+        $this->assertCount(2, $response->decodeResponseJson());
         $response->assertJsonFragment([[
             'id' => $authorized->id,
             'name' => $authorized->name,
diff --git a/tests/php/Http/Controllers/Api/ProjectsAttachableVolumesControllerTest.php b/tests/php/Http/Controllers/Api/ProjectsAttachableVolumesControllerTest.php
index 0702b237e..7fad06121 100644
--- a/tests/php/Http/Controllers/Api/ProjectsAttachableVolumesControllerTest.php
+++ b/tests/php/Http/Controllers/Api/ProjectsAttachableVolumesControllerTest.php
@@ -11,12 +11,12 @@ class ProjectsAttachableVolumesControllerTest extends ApiTestCase
 {
     public function testIndex()
     {
-        $validVolume = VolumeTest::create();
+        $validVolume = VolumeTest::create(['name' => 'test']);
         $validProject = ProjectTest::create();
         $validProject->addVolumeId($validVolume->id);
         $validProject->addUserId($this->admin()->id, Role::adminId());
 
-        $invalidVolume = VolumeTest::create();
+        $invalidVolume = VolumeTest::create(['name' => 'test']);
         $invalidProject = ProjectTest::create();
         $invalidProject->addVolumeId($invalidVolume->id);
         $invalidProject->addUserId($this->admin()->id, Role::editorId());
@@ -25,16 +25,55 @@ public function testIndex()
         $validProject->addVolumeId($existingVolume->id); // should not be returned
         $id = $this->project()->id;
 
-        $this->doTestApiRoute('GET', "/api/v1/projects/{$id}/attachable-volumes");
+        $this->doTestApiRoute('GET', "/api/v1/projects/{$id}/attachable-volumes/test");
 
         $this->beEditor();
-        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes");
+        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes/test");
         $response->assertStatus(403);
 
         $this->beAdmin();
-        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes");
+        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes/test");
         $response->assertStatus(200);
 
+        $this->assertCount(1, $response->decodeResponseJson());
+        $response->assertExactJson([[
+            'id' => $validVolume->id,
+            'name' => $validVolume->name,
+            'media_type_id' => $validVolume->media_type_id,
+            'media_type' => $validVolume->mediaType,
+            'updated_at' => $validVolume->updated_at->toJson(),
+            'thumbnailUrl' => null,
+            'thumbnailsUrl' => [],
+        ]]);
+    }
+
+    public function testIndexFuzzySearch()
+    {
+        $validVolume = VolumeTest::create(['name' => 'my test']);
+        $validProject = ProjectTest::create();
+        $validProject->addVolumeId($validVolume->id);
+        $validProject->addUserId($this->admin()->id, Role::adminId());
+
+        $invalidVolume = VolumeTest::create(['name' => 'my test']);
+        $invalidProject = ProjectTest::create();
+        $invalidProject->addVolumeId($invalidVolume->id);
+        $invalidProject->addUserId($this->admin()->id, Role::editorId());
+
+        $existingVolume = $this->volume();
+        $validProject->addVolumeId($existingVolume->id); // should not be returned
+        $id = $this->project()->id;
+
+        $this->doTestApiRoute('GET', "/api/v1/projects/{$id}/attachable-volumes/test");
+
+        $this->beEditor();
+        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes/test");
+        $response->assertStatus(403);
+
+        $this->beAdmin();
+        $response = $this->get("/api/v1/projects/{$id}/attachable-volumes/test");
+        $response->assertStatus(200);
+
+        $this->assertCount(1, $response->decodeResponseJson());
         $response->assertExactJson([[
             'id' => $validVolume->id,
             'name' => $validVolume->name,