Programmatic Open

You can trigger the search modal from anywhere in your application using JavaScript or PHP.

Alpine.js

If you’re using Alpine.js, you can dispatch the scoutify:open event:

<button x-on:click="$dispatch('scoutify:open')">
    Search Site
</button>

Plain JavaScript

From vanilla JavaScript, use the window.dispatchEvent method:

window.dispatchEvent(new CustomEvent('scoutify:open'));

Livewire (PHP)

From a Livewire component, you can dispatch the event to the modal component:

public function openSearch()
{
    $this->dispatch('scoutify:open')->to('scoutify::modal');
}

Or a global dispatch:

public function openSearch()
{
    $this->dispatch('scoutify:open');
}