HtmlEditor.contentsCss

2012.05.03. 20:00 stack

Nem vagyok meggyőződve, hogy az ExtJS beépített HTML editorra a témában a legjobb választás lenne. Ám legtöbb esetben úgyis csak arra van szükségünk, hogy egyszerű szövegmódosításokat végezhessünk vagy átkapcsolhassunk forrás nézetbe és ott szerkeszthessünk, erre meg maximálisan megfelel.

Egyedül az hiányzik, hogy nem adhatok hozzá külön CSS fájlokat, vagyis adhatok, de ehhez felül kell írni a getDocMarkup függvényt:

{
    xtype: 'htmleditor',
    fieldLabel: 'Leírás',
    name: 'description',
    getDocMarkup: function () {
        return '<html><head><link type="text/css" rel="stylesheet" href="css/style.css" /></head><body class="html-editor"></body></html>';
    }
}

Az eredeti függvényben a body style-nak adtak értéket, de én ezt megadom inkább body.html-editor kezdetű szabályokkal a hozzáadott CSS fájlban.

Szólj hozzá!

Címkék: css htmleditor

Resizable HtmlEditor

2010.03.24. 23:10 stack

Tetszik, ahogy az ExtJS-ben megoldották az átméretezést, véleményem szerint kellően rugalmas. Egy-egy komponens átméretezést egy külön Resizable elem végzi. Létrehozásakor megadjuk az komponens id-ját, illetve az átméretezés konfigurációját. (minimum, maximum méret, átméretezés iránya, dinamikusan változzon az elem mérete, vagy csak egér felengedése után, átméretezés közben legyen-e animáció, tetszőleges méret helyett léptetés stb.)

Egy sima TextArea-nál egyszerű dolgunk van, létrehozzuk a szövegmezőt, majd a Resizable elemnek megadjuk az ő azonosítóját, illetve az átméretezés mikéntjét. Annyit emelnék ki egyedül, hogy néhány elem átméretezéséhez szükség van egy befoglaló div-re, ilyen a textarea is, emiatt van szükség a wrap: true megadására:

var textArea = new Ext.form.TextArea({
    renderTo: Ext.getBody(),
    width: 500,
    height: 250
});

new Ext.Resizable(textArea.id, {
    handles: 's',
    minHeight: 100,
    wrap: true
});

HtmlEditor-nál már kicsit bonyolultabb a helyzet...

Szólj hozzá!

Címkék: resizable htmleditor

ExtJS blog, mi ez?

Az ExtJS egy JavaScript keretrendszer, melyet a blog írója elfogultan a legjobbnak tart, és ez a blog olyan apróságok gyűjteménye, melyek ExtJS használata közben felmerültek, eszébe jutottak...

Címkék

ajax (4) alignto (1) állás (3) analytics (1) anchorto (1) android (4) animate (2) array (9) auto (1) back button (1) beautifier (1) beforeevent (1) benchmark (1) blur (1) budapest.js (1) button (1) canvas (1) capture (1) case sensitive (1) center (1) change (1) cikkajánló (1) class (2) closure compiler (1) collapse (1) combobox (3) comment (1) console.log (2) contextmenu (2) core (2) count (1) css (15) csv (1) dataview (1) date (4) datefield (3) datepicker (1) debug (1) doksi (1) dragdrop (1) easing (1) eclipse (1) editor (1) element (5) error (5) eval (2) event (1) fejtörő (1) field (2) fieldset (1) filter (1) firefox (4) firefox extension (2) focus (3) fonts (1) fun (1) function (1) google (2) google chrome (1) grayscale (1) grid (4) group contact (1) header (3) height (2) hidden (1) hirek (2) history (1) htaccess (1) html5 (2) htmleditor (2) https (1) icon (3) id (2) ie (2) ie6 (1) ie9 (1) iframe (3) image (2) indexof (1) javascript (1) jquery (2) jslint (2) jsmin (1) json (7) keymap (1) kipróbálom (2) könyvajánló (2) label (1) layout (1) lint (1) log (1) loop (1) magyar (2) mandelbrot (1) mask (1) math (1) maxlength (1) mistake (1) mysql (5) napi szívás (16) nem extjs (12) node (1) nth child (1) number (1) off (5) offline (1) operator (1) override (20) pagesize (1) paging (2) panel (2) php (7) picker (1) plugin (3) pozicionálás (2) preload (1) print (1) propertygrid (1) pseudo (3) readonly (2) record (1) regexp (1) replace (1) resizable (1) rotate (1) round (1) scale (1) sencha touch (2) server (1) shuffle (1) slider (1) sort (3) sortable (1) store (2) string (7) sum (1) tabchange (1) tabpanel (1) tab key (2) tdd (1) template (1) textarea (2) textfield (1) textitem (1) theme (2) throw (1) timer (1) timestamp (1) title (2) toggle (1) toolbar (6) tools (1) total count (1) transparent (1) tree (1) treenode (1) trigger (1) truncate (1) try (1) ucfirst (1) undefined (2) unique (1) unload (1) urlencode (1) utf8 (2) verzió (1) video (1) viewer (1) viewport (2) visible (2) vtype (1) window (2) xtype (1) zindex (2)

Extjs.blog.hu - RSS

Kérdés?