site: bind search component open to items.length
This commit is contained in:
		
							parent
							
								
									cc25efc5f4
								
							
						
					
					
						commit
						bf21610576
					
				
					 2 changed files with 4 additions and 5 deletions
				
			
		|  | @ -25,7 +25,7 @@ document.addEventListener('alpine:init', () => { | ||||||
|         return; |         return; | ||||||
|       if (currentWord === this.currentWord) { |       if (currentWord === this.currentWord) { | ||||||
|         /* Show previous items, if any. */ |         /* Show previous items, if any. */ | ||||||
|         this.open = true; |         this.open = this.items.length > 0; | ||||||
|         return; |         return; | ||||||
|       } |       } | ||||||
|       this.currentWord = currentWord; |       this.currentWord = currentWord; | ||||||
|  | @ -35,12 +35,13 @@ document.addEventListener('alpine:init', () => { | ||||||
| 
 | 
 | ||||||
|       if (!response.ok) { |       if (!response.ok) { | ||||||
|         this.items = []; |         this.items = []; | ||||||
|  |         this.open = false; | ||||||
|         return; |         return; | ||||||
|       } |       } | ||||||
| 
 | 
 | ||||||
|       this.activeItem = null; |       this.activeItem = null; | ||||||
|       this.items = await response.json(); |       this.items = await response.json(); | ||||||
|       this.open = true; |       this.open = this.items.length > 0; | ||||||
|     }, |     }, | ||||||
| 
 | 
 | ||||||
|     async fetchSuggestionsOnInput(evt) { |     async fetchSuggestionsOnInput(evt) { | ||||||
|  |  | ||||||
|  | @ -16,9 +16,7 @@ | ||||||
|       @keydown.up.prevent="moveActiveItemBackward" |       @keydown.up.prevent="moveActiveItemBackward" | ||||||
|       @keydown.down.prevent="moveActiveItemForward" |       @keydown.down.prevent="moveActiveItemForward" | ||||||
|       @keydown.escape="open = false"> |       @keydown.escape="open = false"> | ||||||
|     <ul |     <ul x-ref="suggestions" x-cloak x-show="open"> | ||||||
|       x-ref="suggestions" |  | ||||||
|       x-cloak x-show="open && items.length > 0"> |  | ||||||
|       <template x-for="(item, index) in sortedItems" :key="item.display"> |       <template x-for="(item, index) in sortedItems" :key="item.display"> | ||||||
|         <li |         <li | ||||||
| 	  :class="index === activeItem ? 'suggestion-hover' : ''" | 	  :class="index === activeItem ? 'suggestion-hover' : ''" | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue