fix: resolve undefined searchInput reference in Alpine.js component
The searchInput reference was not accessible due to nested x-data scopes. Moved sticky logic into searchResources() to ensure proper reference access.
This commit is contained in:
@@ -12,7 +12,7 @@
|
||||
<div class="pb-4">Deploy resources, like Applications, Databases, Services...</div>
|
||||
<div x-data="searchResources()">
|
||||
@if ($current_step === 'type')
|
||||
<div x-data="{ isSticky: false }" x-init="window.addEventListener('scroll', () => isSticky = window.pageYOffset > 100)" class="sticky top-0 z-50 py-2">
|
||||
<div x-init="window.addEventListener('scroll', () => isSticky = window.pageYOffset > 100)" class="sticky top-0 z-50 py-2">
|
||||
<input autocomplete="off" x-ref="searchInput" class="input-sticky"
|
||||
:class="{ 'input-sticky-active': isSticky }" x-model="search" placeholder="Type / to search..."
|
||||
@keydown.window.slash.prevent="$refs.searchInput.focus()">
|
||||
@@ -137,6 +137,7 @@
|
||||
return {
|
||||
search: '',
|
||||
loading: false,
|
||||
isSticky: false,
|
||||
services: [],
|
||||
gitBasedApplications: [],
|
||||
dockerBasedApplications: [],
|
||||
|
||||
Reference in New Issue
Block a user