简体   繁体   English

ExtJS 5.在具有renderTo的div内包含面板

[英]ExtJS 5. include panel inside a div with renderTo

Using ExtJS 5.0.1 I created an Ext.panel.Panel and I'm trying to show inside a panel with id="contenedor" but never displays. 使用ExtJS 5.0.1,我创建了一个Ext.panel.Panel并且试图显示在具有id="contenedor"的面板内,但是从不显示。

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page language="java"%>
<%@taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
<%@taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>
<%@taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>
<%@taglib uri="/WEB-INF/c.tld" prefix="c"%>
<html>
<head>
    <html:base />
    <title><bean:message key="label.BIA.informe.proceso.verDependencias"/></title>
    <link rel="stylesheet" href="../../config/ProcopEstilos.css" type="text/css" />
    <link rel="stylesheet" href="../../config/css/ext-all.css" type="text/css" />
    <link rel="stylesheet" href="../../config/css/core.css" type="text/css" />
    <style type="text/css">
        .x-panel-icon {background-position:540 1px !important;}
    </style>
    <script src="../../config/Procop.js"> </script>
    <script src="../../config/js/ext-all-5.0.js"></script>
    <script src="../../config/js/ext-dom-utils.js"></script>
    <script src="../../config/js/ExtLocale/<%=request.getSession(true).getAttribute( "langSesion")%>"></script>
    <script src="../../config/js/DD_roundies.js"></script>
    <script src="/<bean:message key="global.application.context.name"/>/private/busquedas/busquedas.js" defer="defer"></script>     

    <script type="text/javascript">   

        var panel;

            var anchura = windowWidth;
            anchura *= 0.970;
            anchura += 1;
            var altura = windowHeight;
            altura *= 0.98;

            panel = Ext.create('Ext.panel.Panel',{
                id:'ventana',
                autoScroll:true,
                height: altura,
                width: anchura,
                title: '&nbsp;<bean:message key="breadcrumbs.gestionInventarios.consultaMultiple" />',
                iconCls:'vDependencias',
                layout: 'border',
                closable: false,
                renderTo: Ext.get('contenedor'),
                resizable: false,
                items:[
                   {xtype:'button',text: 'Press Me'}, 
                   {xtype:'textfield',text: 'Press Me'}
                ],
                frame: true
            });    
    </script>
</head>
<body class="body2">

    <div style="text-align: center; height: 100%;">
        <div id="contenedor" style="margin: 5px auto 0px; width: 100%; height: 98%;">
            <html:form action="/GIConsultaMultiple?method=consultaMultiple">                        
                <!-- Elementos ocultos del formulario -->
                    <html:hidden property="idTipoActivo" />
                    <html:hidden property="idActivo" />
                    <html:hidden property="nombreActivo" />
                <!-- Fin elementos del formulario -->               
            </html:form>
        </div>
    </div>
</body>
</html>

I tried with renderTo: Ext.get('contenedor') , renderTo: 'contenedor' and Ext.getBody() . 我尝试了renderTo: Ext.get('contenedor')renderTo: 'contenedor'Ext.getBody()

What am I doing wrong? 我究竟做错了什么?

Solved, my problem is very simple. 解决了,我的问题很简单。

I was trying to render with my code inside <head> tag, so document is not created yet. 我试图用<head>标记内的代码进行渲染,因此尚未创建文档。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM