CODEWITHSUNDEEP
javascriptckeditor
Avatar
Avatar

Reputation: 15176

How to set focus on an input element in CKEditor 4?

For the link dialog I am presenting my users only a minimal dialog:

Screenshot

The code for this from the config.js file:

CKEDITOR.on('dialogDefinition', function(ev) {
    // Take the dialog name and its definition from the event data.
    var dialogName = ev.data.name;
    var dialogDefinition = ev.data.definition;

    // Check if the definition is from the dialog we are interested in (the 'link' dialog)
    if (dialogName == 'link') {
        // Get a reference to the 'Link Info' tab.
        var infoTab = dialogDefinition.getContents('info');
        // Remove unnecessary widgets from the 'Link Info' tab.
        infoTab.remove('linkType');
        infoTab.remove('protocol');
        infoTab.remove('browse');

        // Get a reference to the "Target" tab and set default to '_blank'
        var targetTab = dialogDefinition.getContents('target');
        var targetField = targetTab.get('linkTargetType');
        targetField['default'] = '_blank';

    // focus URL field
    // targetTab.focus(); // NOT working, function does not exist
    }
}

Could anybody tell me how to focus the input field?

PS: I also tried to use dialogDefinition.onShow = function () { } without success.

Upvotes: 0

Views: 2515

Answers (1)

oleq
oleq

Reputation: 15895

Overwrite onFocus method in your dialog definition:

if (dialogName == 'link') {
    ....
    dialogDefinition.onFocus = function() {
        this.getContentElement( 'info', 'url' ).focus();
    }
}

Upvotes: 0

Related Questions