Custom fields in Dialogs?

I've been trawling the docs and forums for days but I cannot find any information.

I've added a custom select to the "Link Info" dialog but how do I tell ckeditor to use the selected value when the dialog OK button is pressed? I want to add a rel attirubute to the link e.g.

<a href="http://example.com" rel="nofollow external">Anchor</a>

                infoTab.add( // Add a text field to the "info" tab
                {
                    type : 'select',
                    label : 'Rel:',
                    id : 'relField',
                    'default' : "",
                    items:
                    [
                        ["<none>", ""],
                        ["nofollow external (new window, icon)", "nofollow external"],
                        ["nofollow outbound (new window)", "nofollow outbound"]
                    ],
                    onChange:function()
                    {
                        var dialog = this.getDialog();
                        
                        alert(dialog.getValueOf('info', 'relField')); // displays selected value  
                    }
                });

Do I need to code anything to ensure that the correct "rel" option is selected when the dialog is opened (to edit an existing link)?

Also, is it possible to add some static HTML to the dialog? E.g. <p>Some instructional text.</p>

Thanks,

Wed, 09/22/2010 - 13:47

beren

Joined: 25/11/2009

Posts: 9

Re: Custom fields in Dialogs?

I tried to edit my post but the forum seems to log me out every time (extremely annoying!) :evil:

I copied my post to the clipboard before I hit the "Submit" button:

I think I found the handler but do I really have to rewrite the whole thing just to add an attribute?
Do I also have to write code to make sure the correct "rel" option is selected when the dialog is opened (if editing an existing link)?

dialogDefinition.onOk = function()
{
    var link = '<a href="';
    
    var protocolField = this.getContentElement('info', 'protocol');
        link += protocolField.getValue();
        
    var urlField = this.getContentElement('info', 'url');
        link += urlField.getValue() + '"';
        
    var relField = this.getContentElement('info', 'relField');
    var rel = relField.getValue();
    if (rel != "")
    {
         link += ' rel="' + rel + '"'  
    }
    
    link += '>' + 'Anchor' + '</a>';
        
    var editor = $('#content').ckeditorGet();
    editor.insertHtml(link);
}

What is the correct way to reference the CKEDITOR that opened the Dialog?
And how should I reference the selected text in the editor (if any is selected)?

Thanks,