Question

A beginner’s question. I have a bit of rich HTML inside a hidden div, and want to turn it into a floating, draggable, closeable pseudo-window, modeless dialog. YUI and ExtJS are available.

I have tried several hours and sought through samples in the net. The window title should be gotten from a DOM node too, but is plain text.

    var helpDiv = ... DOM node
    var helpDivExt = Ext.get(helpDiv);
    var contentHTML = '<i>helpDivExt</i>';
    //var contentTitel = '###' + helpDivExt.select('h3');
    var contentTitel = '###' + Ext.query('h3:first', helpDivExt).data;
    var w = new Ext.Window({html: contentHTML, title: contentTitel,
        width: '398px', height: '400px',
        modal: false, closable: true, draggable: true,
        plain: true,
        padding: '5px 10px 10üpx 10px',
        border: '5px solid #7094b7',
        backgroundColor: '#ffffff'
    });
    w.addClass('hilfetext');
    //w.fill(helpDivExt);
    //w.add(helpDivExt);
    w.show();

Answer 1

In ExtJS Ext.Window there is contentEl config where you put in an existing HTML element, or the id of an existing HTML element:

e.g.

new Ext.Window({contentEl: 'the_element_id'});

Further info here