1d:T51e,Well this works... lol - Focuses the first input field on the page as well as a modal when it pops up. Need to do some rework to make it auto focus the first specified `autofocus=autofocus` input on the page. ```php FilamentView::registerRenderHook( 'panels::body.start', fn(): string => new HtmlString(<< window.addEventListener('load', function(e) { document.querySelector('main .fi-input').focus() }) let observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { if (mutation.addedNodes) { mutation.addedNodes.forEach(function(node) { // Check if it has the x-ref attribute modalContainer if (node.nodeType === 1 && node.matches('[x-ref=\'modalContainer\']')) { setTimeout(function () { node.querySelector('.fi-input').focus() }, 100) } }) } }) }) observer.observe(document.body, { childList: true, subtree: true }) HTML ) ); ```1e:T545,Ohh! this works great! ```php FilamentView::registerRenderHook( 'panels::body.start', fn(): string => new HtmlString(<< function autoFocus(element) { let input = element.querySelector("[autofocus='autofocus']"); if (input) { setTimeout(function() { input.focus(); }, 100); } } window.addEventListener("load", function(e) { autoFocus(document); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { if (mutation.addedNodes) { mutation.addedNodes.forEach(function(node) { // Check if it's an Element node and has the x-ref attribute 'modalContainer' if (node.nodeType === 1 && node.matches("[x-ref='modalContainer']")) { autoFocus(node); } }); } }); }); observer.observe(document.body, { childList: true, subtree: true }); }); HTML ) ); ``` This auto selects the first input element on the page (edit page OR modal (even the slideover)).

Autofocus in a Modal

Similar Threads

Similar Threads

Similar Threads