Faisal N. Nabi
Faisal N. Nabi

Reputation: 21

TinyMCE auto_focus not working

Im using TinyMCE for a replying mail form. The cursor should automatically land in the text entry. I used auto_focus:true but it would not work. Plz help.

My codes:

<script type="text/javascript">
tinymce.init({
    selector: "textarea.tmce",
    theme: "modern",
    auto_focus:true,
    plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste"
    ],
    toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
    toolbar2: "print preview media | forecolor backcolor emoticons",
    templates: [
        {title: 'Test template 1', content: 'Test 1'},
        {title: 'Test template 2', content: 'Test 2'}
    ],
});
</script>

Upvotes: 2

Views: 3383

Answers (4)

大宅广
大宅广

Reputation: 1

With regards to the execCommand point mentioned above, that is expected as if you're running a command then you're normally trying to edit content. You can disable this however by setting the skip_focus: true property in the args passed to execCommand. eg: http://fiddle.tinymce.com/Gxgaab/1

Upvotes: 0

jonalvarezz
jonalvarezz

Reputation: 769

There seems not to be way to disable the default auto focus. The workaround I found out, was to hook in the init_instance_callback option.

Something like:

tinymce({
    ...,
    init_instance_callback: () => {
        window.setTimeout(() => {
            document.querySelector('#myInput').focus();
        }, 0)
    }
})

I added setTimeout(cb, 0) just to ensure the callback is executed after the init_instance_callback

Upvotes: 1

robgfaulkner
robgfaulkner

Reputation: 106

The auto_focus property should contain the ID of the item that you want to focus on.

auto_focus: This option enables you to auto focus an editor instance. The value of this option should be an editor instance id. The editor instance id is the id for the original textarea or div element that got replaced.

I have actually seen IE7+ throw js errors if you had auto_focus set to true and not the ID of the textarea or div.

Upvotes: 0

Thariama
Thariama

Reputation: 50832

You may use something like this

tinyMCE.init({
   ...
   setup : function(ed) {
      ed.onInit.add(function(ed) {
          ed.focus();
      });
   }
});

Upvotes: 2

Related Questions