nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Howto place cursor after Add -> Page directly in Title-Field? (jQuery? AJS?)

Sven

Hello,

so often the users forget to fill in the Title of a page. It would be of great help, if after Add -> Page, the cursor would be placed in the title field and not in the WYSIWG-content-field (new editor).

I've been trying some "jQuery magic", but it's not working.

What's wrong?

I tried:

&lt;script&gt;
jQuery(document).ready(function() {
    // on add -&gt; page, set focus on title, not on content
    jQuery("#content-title").focus();

    jQuery("#input:text:visible:first").focus(); 
});
&lt;/script&gt;

Thanks for any suggestion,

Sven

Accepted answers

All comments

JamieA

Worked for me (tm). Is the JS definitely running? Try an alert or console.log statement,

Sven

Thanks for trying!

Hmm. How I can do a console.log from javascript? Where did you put the code exactly?

(in the meanwhile I've a lot of jQuery-Hacks, maybe another "hack" is disabling this ;-)

JamieA

I just pasted it into the Chrome console... press f12. Or same in firefox with firebug...

Sven

/EDIT

I've tested in Chrome and yes, there cursor "hops" for a millisecond to the title field (it clears the text "Please enter title") and then jumps back into the main edit field...

???

Looks like there is another mechanism which is stronger to bring the cursor back in the main edit field ;-/

/EDIT

yeah, I've inserted it into "Custom HTML - before end of head" - maybe that's too early? The new editor is in an iframe (but not the title), perhaps this is the reason?

Could you try to insert it there and tell me if it still works for you?

Thanks anyway!

JamieA

Ah yes, sounds like another dom ready handler is also setting focus. BTW I tried it on an older version, 3.4.9, maybe it's changed. You could try AJS.toInit(..) instead of AJS.$(). It's also possible with some javascript to make your handler fire last, but it's a bit of a pain...

Sven

/EDIT

AJS.toInit() changed nothing ;-(

/EDIT

Ah yes... 4.x changed the whole editor thing. So this is the reason ;-)

Thanks for your suggestions, I'll try this... I've seen that the "new" editor sits in an iframe, does this change something? Maybe?

If you have suggestions (links to useful information) about how to make a handler fire at last, don't hesitate...

JamieA

try http://stackoverflow.com/questions/290254/how-to-order-events-bound-with-jquery or http://stackoverflow.com/questions/827107/jquery-mulitple-click-handlers-how-to-ensure-order-of-firing. You might be better off just making a source hack though. Also yeah, the iframe may change things, not sure...