PDA

View Full Version : Problem with Layout - Tree Panel not expanding into other region



vayumahesh
22 Sep 2008, 8:03 AM
I have layout window with 2 regions. On the west region, I have html section on top and tree panel at bottom. When I collapse html section, I thought tree panel would readjust itself into the blank space but it is not. html section is hiding the content but keeping the space. When I collapse tree panel though, html section is expanding into the blank space of tree panel. Not sure what I am missing.

Here is my code.



var matrixPanel = {
id: 'matrix-id',
title: 'Phase View by Dept-Area',
region: 'center',
height: 125,
collapsible: true,
bodyStyle: 'padding-bottom:5px;',
autoScroll: true,
html: '<p class="details-info">Phase View Matrix to be displayed here.</p>'
};

var caTreePanel = new caTree.TreePanel({
region:'south',
id:'caTreePanelId',
title:'Courses/Assignments',
height: 300,
width:350,
minSize: 300,
maxSize: 650,
collapsible: true,
margins:'0 0 0 0',
cmargins:'0 0 0 0',

autoScroll:true,
loader: new caTree.TreeLoader({
dataUrl:'extJs/desktop/classTree.jsp'
}),

enableDD:false,
root: caTreeRoot
});





items:[{
layout: 'border',
id: 'tab-instructions',
region:'center',
border: false,
split:true,
margins: '2 0 5 5',
items: [UpdTrTabPanel, instructionsPanel]
},{
layout: 'border',
id: 'matrix-tree',
region:'west',
border: false,
split:true,
margins: '2 0 5 5',
width: 350,
items: [caTreePanel, matrixPanel]
}]

ramaprabhu
26 Nov 2008, 5:34 AM
hi can u send the jsp code which builds tree in extjs?i want to know how to prepare json format can you post it?
thanks in advance

stevanovich
26 Nov 2008, 5:40 AM
matrixPanel is "center" region ?

Condor
26 Nov 2008, 5:44 AM
Make the west region also layout:'border' and add a north region with the HTML and a center region with the tree.

vayumahesh
26 Nov 2008, 7:08 AM
Thanks Condor.

Ramaprabhu,

Here is my complete JSP page. Hope it helps.



<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>
<sql:setDataSource dataSource="jdbc/ccrwCrossFunctionalTraining" />

<sql:query var="courseQry">
select courseDetails.courseId, courseDetails.courseName, courseDetails.trClass
from courseDetails
where courseDetails.active = 1 and courseDetails.trClass = 1 and courseDetails.courseID IN (select distinct courseId from classDetails where couClassActive = 1)
order by courseDetails.courseName
</sql:query>
<sql:query var="assignmentQry">
select courseDetails.courseId, courseDetails.courseName, courseDetails.trClass
from courseDetails
where courseDetails.active = 1 and courseDetails.trClass = 0
order by courseDetails.courseName
</sql:query>

<json:array name="coursesAssignments">
<json:object>
<json:property name="text">Department, Area => ALL</json:property>
<json:property name="expanded" value="${true}"/>
<json:property name="singleExpand" value="${true}"/>
<json:property name="cls" value="fontbold"/>
<json:property name="id" value="0001"/>
<json:array name="children">
<json:object>
<json:property name="id" value="01"/>
<json:property name="text">
COURSES (Self-Monitoring)
</json:property>
<json:property name="expanded" value="${true}"/>
<json:property name="singleExpand" value="${true}"/>
<json:property name="cls" value="fontbold"/>
<json:array name="children">
<%-- Loop over courses --%>
<c:forEach items="${courseQry.rows}" var="courseQryRows">
<json:object>
<json:property name="id" value="c${courseQryRows.courseId}"/>
<json:property name="courseId" value="${courseQryRows.courseId}"/>

<%-- Query to determine the course completion status --%>
<sql:query var="couTrRecQry">
select empTraining.compStatus
from empTraining
where userGmin=? and courseId=? and compStatus=1
<sql:param value="${sessionScope.userGmin}"/>
<sql:param value="${courseQryRows.courseId}"/>
</sql:query>
<%-- Query to determine if course completion in progress --%>
<sql:query var="couTrRecExQry">
select empTraining.compStatus
from empTraining
where userGmin=? and courseId=?
<sql:param value="${sessionScope.userGmin}"/>
<sql:param value="${courseQryRows.courseId}"/>
</sql:query>
<%-- Get the Status Code --%>
<c:choose>
<c:when test="${couTrRecQry.rowCount eq 0 && couTrRecExQry.rowCount eq 0}">
<c:set var="couCompStatus" value="" />
</c:when>
<c:when test="${couTrRecQry.rowCount gt 0}">
<c:set var="couCompStatus" value=" -- [C]" />
</c:when>
<c:when test="${couTrRecExQry.rowCount gt 0}">
<c:set var="couCompStatus" value=" -- [IP]" />
</c:when>
<c:otherwise>
<c:set var="couCompStatus" value="" />
</c:otherwise>
</c:choose>

<json:property name="text" value="${courseQryRows.courseName}${couCompStatus}"/>

<sql:query var="classQry">
select classDetails.classId, classDetails.className
from classDetails
where classDetails.couClassActive = 1 and classDetails.courseId = '${courseQryRows.courseId}'
order by classDetails.classOrder
</sql:query>

<%-- If classes present for course, else --%>
<c:choose>
<c:when test="${classQry.rowCount gt 0}">
<json:property name="cls" value="folder"/>
<json:array name="children">
<%-- Loop over classes for course --%>
<c:forEach items="${classQry.rows}" var="classQryRows">
<%-- Display the classes even if no class parameters are present. Engineer can just submit and mark it as completed --%>
<%-- Query to determine the class completion status --%>
<sql:query var="claTrRecQry">
select empTraining.compStatus
from empTraining
where userGmin=? and courseId=? and classId=?
<sql:param value="${sessionScope.userGmin}"/>
<sql:param value="${courseQryRows.courseId}"/>
<sql:param value="${classQryRows.classId}"/>
</sql:query>
<%-- Get the Status Code --%>
<c:choose>
<c:when test="${claTrRecQry.rowCount eq 0}">
<c:set var="claCompStatus" value="" />
</c:when>
<c:when test="${fn:trim(claTrRecQry.rows[0].compStatus) eq 1}">
<c:set var="claCompStatus" value=" -- [C]" />
</c:when>
<c:otherwise>
<c:set var="claCompStatus" value=" -- [IP]" />
</c:otherwise>
</c:choose>
<json:object>
<json:property name="id" value="${classQryRows.classId}"/>
<json:property name="classId" value="${classQryRows.classId}"/>
<json:property name="text" value="${classQryRows.className}${claCompStatus}"/>
<json:property name="courseId" value="${courseQryRows.courseId}"/>
<json:property name="courseName" value="${courseQryRows.courseName}"/>
<json:property name="trClass" value="${courseQryRows.trClass}"/>
<json:property name="leaf" value="true"/>
<json:property name="cls" value="file"/>
</json:object>
</c:forEach>
</json:array>
</c:when>
<c:otherwise>
<json:property name="leaf" value="true"/>
<json:property name="cls" value="file"/>
</c:otherwise>
</c:choose>
</json:object>
</c:forEach>
</json:array>
</json:object>

<json:object>
<json:property name="id" value="00"/>
<json:property name="text" value="ASSIGNMENTS (Need Manager Approval)"/>
<json:property name="expanded" value="${true}"/>
<json:property name="cls" value="fontbold"/>
<json:array name="children">
<%-- Loop over assignments --%>
<c:forEach items="${assignmentQry.rows}" var="assignmentQryRows">
<%-- Query to determine the assignment completion status --%>
<sql:query var="assiTrRecQry">
select empTraining.mgrAppStatus
from empTraining
where userGmin=? and courseId=?
<sql:param value="${sessionScope.userGmin}"/>
<sql:param value="${assignmentQryRows.courseId}"/>
</sql:query>
<%-- Get the Status Code --%>
<c:choose>
<c:when test="${assiTrRecQry.rowCount eq 0 || empty fn:trim(assiTrRecQry.rows[0].mgrAppStatus)}">
<c:set var="assiCompStatus" value="" />
</c:when>
<c:when test="${fn:trim(assiTrRecQry.rows[0].mgrAppStatus) eq 'Pending'}">
<c:set var="assiCompStatus" value=" -- [P]" />
</c:when>
<c:when test="${fn:trim(assiTrRecQry.rows[0].mgrAppStatus) eq 'Complete'}">
<c:set var="assiCompStatus" value=" -- [C]" />
</c:when>
<c:when test="${fn:trim(assiTrRecQry.rows[0].mgrAppStatus) eq 'Rejected'}">
<c:set var="assiCompStatus" value=" -- [R]" />
</c:when>
<c:otherwise>
<c:set var="assiCompStatus" value="" />
</c:otherwise>
</c:choose>
<json:object>
<json:property name="id" value="a${assignmentQryRows.courseId}"/>
<json:property name="courseId" value="${assignmentQryRows.courseId}"/>
<json:property name="courseName" value="${assignmentQryRows.courseName}"/>
<json:property name="text" value="${assignmentQryRows.courseName}${assiCompStatus}"/>
<json:property name="trClass" value="${assignmentQryRows.trClass}"/>
<json:property name="leaf" value="false"/>
<json:property name="cls" value="folder"/>
</json:object>
</c:forEach>
</json:array>
</json:object>
</json:array>
</json:object>
</json:array>

Condor
26 Nov 2008, 7:13 AM
Posting your JSP doesn't really help.

Please post the server response from the JSP!

vayumahesh
28 Nov 2008, 7:11 PM
Condor,

Sorry for the confusion. This issue was resolved. I posted the JSP code for Ramaprabhu.