В одной из тем форума UniGui проскакивал вопрос – как настроить фокус для input элемента Ext.form.field.HtmlEditor. По совету одного из форумчан Delphi Developer это делалось такой строкой
|
1 |
UniSession.AddJS('Ext.get("'+ UniHTMLMemo1.JSName +'_id-inputCmp-iframeEl").focus()'); |
Если с Ext.get(‘some_id’).focus(); все понятно, то непонятно как формировался id элемента.
Мне стало интересно как формируется id и я полез во внутренности ExtJS и UniGui
Если создать UniGui проект в Delphi и положить на форму один единственный элемент UniHTMLMemo, то после запуска в браузере можно наблюдать такой код
|
1 2 3 |
... O13=new Ext.form.field.HtmlEditor({id:"O13_id",value:"UniHTMLMemo1\n",name:"O13",enableKeyEvents:true,tabIndex:11,width:257,height:113,x:72,y:32}); ... |
С первой частью id все ясно, в данном случае O13_id, это id самого элемента Ext.form.field.HtmlEditor, далее нам нужно получить фокус на поле ввода. Покопавшись немного во внутренностях метода createInputCmp, я пришел к выводу что при определении класса Ext.form.field.HtmlEditor , в частности, создается массив
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
componentTpl: [ '{beforeTextAreaTpl}', '<textarea id="{id}-textareaEl" data-ref="textareaEl" name="{name}" tabindex="-1" {inputAttrTpl}', ' class="{textareaCls}" autocomplete="off">', '{[Ext.util.Format.htmlEncode(values.value)]}', '</textarea>', '{afterTextAreaTpl}', '{beforeIFrameTpl}', '<iframe id="{id}-iframeEl" data-ref="iframeEl" name="{iframeName}" frameBorder="0" {iframeAttrTpl}', ' src="{iframeSrc}" class="{iframeCls}"></iframe>', '{afterIFrameTpl}', { disableFormats: true } ] |
Мы видим, что тут 2 ключевых элемента, это textarea и iframe.
Далее, немного проанализировав исходный код, можно понять, что id создается из 3 элементов.
id самого элемента htmleditor
id = me.id + ‘-inputCmp’ //здесь к нему плюсуется inputCmp в методе getInputCmpCfg
{id}-iframeEl // ну и последний элемент плюсуется непосредственно в массиве componentTpl
В итоге у нас получается
|
1 |
+ UniHTMLMemo1.JSName +'_id-inputCmp-iframeEl |
И почему + в начале, по правилам яваскрипта это преобразование типов, к числовому типу.