JavaScript

Front-end
#1

Galera, não manjo mto de javaScript e peguei um projeto que tem essa função mas não sei o que ela faz.
Sei que tá usando Ext, mas não entendi direito.

function onClickPanel(node){ var genericGrid = null; var nodeText = replaceAll(node.text," ",""); alert('genericGrid = Grid_'+nodeText); if(Ext.getCmp('wholeView').findById('centerPanel').findById(node.text.toLowerCase())==null){ eval('genericGrid = Grid_'+nodeText); Ext.getCmp('wholeView').findById('centerPanel').add( { title: node.text, id: node.text.toLowerCase() , layout:'fit', closable : true, items: [genericGrid.grid()] } ); } }

Será que alguém poderia me explicar o que essa função faz?

#2

Bem, eu não uso o ExtJS assim, mas vamos lá.

[code]// uma função, provavelmente um manipulador de eventos
function onClickPanel( node ) {

// uma variável
var genericGrid = null;

// outra variável, recebendo o valor do texto do nó sem espaços
var nodeText = replaceAll(node.text," ","");

// mostra um alert com o novo texto do nó
alert('genericGrid = Grid_'+nodeText);

// bem, aqui já começa a bagunça
// esse monte de findById encadeado é nojento.
// o ideal seria que cada "coisa" obtida no findById fosse um componente do Ext, ai não
// precisaria fazer essa sujeira, bastando apenas usar o Ext.getCmp, que a propósito
// é usado para obter uma referência ao componente do Ext que tem como id o valor passado
// pela função Ext.getCmp (getComponent)

// enfim, aqui é verificado se NÃO existe um componente que tenha como id o valor do texto do nó
if( Ext.getCmp('wholeView').findById('centerPanel').findById(node.text.toLowerCase())==null){

    // nojento... usando eval para atribuir valor em uma variável
    // isso é feito pq provavelmente devemm haver variáveis globais com o prefixo "Grid_".
    // eu não faria assim.

    // falo que é nojento pq é difícil de ler para quem é iniciante, além de deixar o código uma bagunça.
    eval('genericGrid = Grid_'+nodeText);

    // mais uma vez o findById
    // ao encontrar o componente "centerPanel"
    // adiciona um novo objeto com as propriedades abaixo.

    // normalmente no ExtJS usa-se uma propriedade chama xtype p/ 
    // informar à "engine" do Ext que tipo de componente vc está adicionando
    // além de deixar mais claro o que está acontecendo para quem vai manter o código
    // a adicção de componenets sem o a propriedade xtype varia de container para container
    // ai vc precisav er a documentação.
    Ext.getCmp('wholeView').findById('centerPanel').add({
        title: node.text,
        id: node.text.toLowerCase() ,
        layout: 'fit',
        closable: true,
        items: [
            genericGrid.grid()
        ]
    });
}

}[/code]

Onde vc copiou esse código? Muito confuso e cheio de más práticas.

[]´s

#3

Então David, esse código tá no projeto que eu to fazendo aqui no trampo.
Eu tenho o viewPort e dentro dele 2 panels: leftPanel e centerPanel (na verdade o centerPanel é um tabPanel).
No leftPanel eu tenho uma lista e quando o usuário clica em algum nó da árvore eu tenho que abrir uma aba no centerPanel.
Meu código está assim:

<ext:tree.treePanel id="leftPanel_Conteudo_Digital" title="Conteúdo Digital" listeners="{click: onClickPanel}" draggable="false" border="false" > <ext:tree.treeLoader dataUrl="conteudodigital.action" /> </ext:tree.treePanel>

Os nós da árvore são carregados na minha conteudoDigital.jsp
Minha dúvida é como chamar o metodo onClickPanel e passar como parametro o nome do Nó.
Vc poderia me ajudar?

#4

Olá,

Primeiro de tudo. Pare de usar essa taglib do ExtJS. Não sei nem quando isso ai foi alterado pela última vez. Ainda tem gente que mantém essa taglib??? A versão do site é relativa ao ExtJS 2.0! Já está quase na versão 4.0. Codifique na mão o JavaScript e baixe a biblioteca do site oficial.

Segundo, recomendo vc ler a documentação e usá-la como base para trabalhar com o ExtJS.

[]´s

#5

Putz David, eu não posso mudar.
Foi definido que usariamos essa taglib, juntamente com o JSON e Java.
Vou ter que me virar pra fazer funcionar.
Se puder me ajudar, agradeceria mto amigo

#6