PropertyGrid Layout - Ext JS
4854 단어 JavaScriptcssIEextyui
(1) In IE7 when a string is wider than the size of the column, you get the ... indicator at the end of the text - this is missing when the same page is viewed in Firefox 2.
(2) This is more of a strange positioning issue. Using the sample code below (which can be saved into any html file - changing the ext locations at the top of the file).
When you double-click on the value field, the editable text field appears, but is not correctly centered - it is slightly shifted to the left - and you can see the original underlying text at the far right side. I know this is probably a css issue (most likely in my example rather than EXT) as the PropertyGrid looks as it should in Jack's Ext Debug Console and Inspector dialog - but am not sure where?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Grid Test</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/yui-utilities.js"></script>
<script type="text/javascript" src="ext/ext-yui-adapter.js"></script>
<script type="text/javascript" src="ext/ext-all-debug.js"></script>
<script type="text/javascript">
AppPanels = function(){
return {
init : function(){
var layout = new Ext.BorderLayout(document.body, {
hideOnLayout: true,
east: {
split:true,
initialSize: 250,
minSize: 175,
maxSize: 400,
titlebar: true,
collapsible: true,
animate: true
},
center: {
titlebar: true,
autoScroll:false
}
});
var propsFilterLayout = new Ext.BorderLayout('content', {
center: {
titlebar: true,
autoScroll:true
}
});
layout.beginUpdate();
var stylesGrid = new Ext.grid.PropertyGrid('propsPanel', {
nameText: 'Style',
enableCtxMenu: false,
enableColumnResize: true,
clicksToEdit: 2
});
stylesGrid.setSource({});
var stylePanel = propsFilterLayout.add('center',
new Ext.GridPanel(stylesGrid, {title: 'Node:'}));
stylesGrid.render();
stylesGrid.getView().mainHd.setDisplayed(true);
layout.add('east', new Ext.NestedLayoutPanel(propsFilterLayout, {title: 'Properties', closable: false}));
layout.add('center', new Ext.ContentPanel('center1', {title: 'Graph', closable: false}));
layout.endUpdate();
var value = new Ext.grid.PropertyRecord({
name: "Description",
value: "This is a slightly long description which may or may not be useful!"
});
var locds = stylesGrid.getDataSource();
locds.insert(0,value);
}
};
}();
Ext.EventManager.onDocumentReady(AppPanels.init, AppPanels, true);
</script>
</head>
<body>
<div id="center1">Central panel.</div>
<div id="content"></div>
<div id="propsPanel"></div>
</body>
</html>[/code]
#
2
03-11-2007, 05:51 PM
(1) uses an IE only css setting. I don't think it's possible to do proper ellipsis on FF.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
기초 정리 - 1문자 (String) 숫자 (Number) 불린 (Boolean) null undefined 심볼 (Symbol) 큰정수 (BigInt) 따옴표로 묶어 있어야 함 Not-A-Number - 숫자 데이터 / 숫자로 표...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
