Actualizar el contenido de una ventana en el evento en otra ventana con ExtJS

Question

Hace algún tiempo, empecé a aprender de la biblioteca ExtJS y ahora me gustaría crear siguiente:

Hay una ventana del navegador y se separa verticalmente.
A la izquierda hay un TreePanel con los directorios y subdirectorios (sólo 2 nivel profundo).
En el lado derecho habrá una salida para el contenido del subdirectorio seleccionado.

Me han hecho la parte de interfaz, pero no la forma de cambiar el contenido de la derecha cuando el usuario hace clic en el subdirectorio en el lado izquierdo. Puedo hacer la solicitud con Ext.Ajax.request, pero no sé cómo activar la actualización del contenido para el lado derecho.

Por cierto. Como ya he mantioned el lado izquierdo es TreePanel y el lado derecho es GripPanel y se encuentran en la ventana gráfica con xtype:. 'Panel', pero no creo que esto es imoptant para esa pregunta

¿Alguna sugerencia?

Answer 1

En primer lugar, es necesario registrar el hecho de que el usuario es seleccionar un nodo en el treepanel, esto se puede hacer a través de:

yourtreepanel.getSelectionModel().on('selectionchange', whattodonext);

¿Dónde yourtreepanel 'es el nombre de su treepanel (si el treepanel se asigna a una variable, de lo contrario usar Ext.getCmp ( 'yourtreepanel'). GetSelecti ....) y 'whattodonext' es el nombre de la función a la llamada cuando el usuario choses un nodo.

La función 'whattodonext' podría tener el siguiente aspecto:

    function whattodonext(){
        node=yourtreepanel.selModel.selNode;
        if(node){
            if(node.isLeaf()){
// this works out what you want to do if the user has selected a valid leaf node


            }else{
// otherwise...put anything you wish to happen here (i.e. if a folder has been selected)

            }

        }   
    }

La siguiente parte es actualizar el panel a la derecha con el contenido (si se llama 'mycontentpanel'). Diga este contenido debe ser cargada desde 'mycontent.html', en la sección con

// this works out what you want to do if the user has selected a valid leaf node

Se pondría el código:

mycontentpanel.load({
url: 'mycontent.html',
params: {
yourparam1:'param1value',
yourparam2:'param2value'
},
nocache: true,
timeout: 30
});

Y eso es todo!

Puede utilizar las opciones params enviar ningún parámetro puesto específico que tenga que decidir qué se han publicado contenido.

Y no se olvide, si ejecuta en dificultades, intente hacer referencia a los objetos utilizando Ext.getCmp ( 'objectname') en lugar de sólo 'objectname'.operation ....

Buena suerte!