Javascript-форум (https://javascript.ru/forum/)
-   ExtJS (https://javascript.ru/forum/extjs/)
-   -   Перенос строк в Ext.grid.Panel (https://javascript.ru/forum/extjs/36155-perenos-strok-v-ext-grid-panel.html)

khusamov 05.03.2013 16:31

Перенос строк в Ext.grid.Panel
 
Здравствуйте!

Есть ли возможность в гриде сделать перенос строк?

Сейчас, если строка по ширине в столбце не умещается, то обрезается с тремя точками на конце. А нужно, чтобы строка переносилась на вторую строку.

skrudjmakdak 03.04.2013 14:07

Ext.create('Ext.Window', 
	{
	title: 'title',
    height: 150,
    width: 200,
    closeAction: 'hide',
    items: [
		{
		xtype: 'grid',
		width: '100%',
		height: 100,
		store: Ext.create('Ext.data.Store',
			{
			fields: ['id', 'name'],
			data: [
				{name: 'мой текст <br>продолжение'},
				{name: 'текст'}
				]
			}),
		columns: [
			{
			header: 'name',
			dataIndex: 'name',
			flex: 1
			}]
		}]
	}).show();



так?

skrudjmakdak 03.04.2013 14:17

вот второй вариант, правда немного не стандартный:
<html>
	<head>
		<script type="text/javascript" src="js/ext/ext-all.js"></script>
		<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css">
		<style type="text/css">
		#grid1 .x-grid-cell-inner
		{
		white-space: normal;
		}
		</style>
		<script type="text/javascript">
Ext.onReady(function(){
//-------------------
Ext.create('Ext.Window', 
	{
	title: 'title',
    height: 300,
    width: 300,
    closeAction: 'hide',
    items: [
		{
		xtype: 'grid',
		id: 'grid1',
		width: '100%',
		height: 200,
		store: Ext.create('Ext.data.Store',
			{
			fields: ['id', 'name'],
			data: [
				{name: 'Многоязычный проект по созданию полноценной и точной энциклопедии со свободно распространяемым содержимым. Любой пользователь может'},
				{name: 'текст'}
				]
			}),
		columns: [
			{
			header: 'name',
			dataIndex: 'name',
			flex: 1
			}]
		}]
	}).show();
	
	
//-------------------
	});
	
		</script>
	</head>
	<body>
	</body>
</html>

khusamov 03.04.2013 15:50

Первый не катит. Так как текст уже есть. Не буду же я туда вставлять <br>? Да и не ясно куда их вставлять, так как ширина колонки в общем случае неизвестна.

Второй вариант тоже не катит, ибо это вообще хак.

Я вопрос ставил в плане того, может опция есть какая-то? Может я чего упустил.

То есть нужна легальная опция типа WRAP = true|false

khusamov 03.04.2013 15:51

Хотя второй вариант похоже самый наилучший.

skrudjmakdak 03.04.2013 16:41

khusamov, кто вам сказал, что второй вариант это хак? хочу поспорить.
во-первых есть возможность вставлять свои css стили, например здесь:
http://docs.sencha.com/ext-js/4-1/#!...xt.panel.Panel
смотрите в property: cls
во-вторых: посмотрите в примерах, компания сама демонстрирует вставку своего css, ну например здесь:
http://docs.sencha.com/ext-js/4-1/ex...rray-grid.html

khusamov 03.04.2013 17:57

В примерах они поменяли лишь цвет. А вы поменяли компоновку. Все-таки это куда более серьезное изменение, которое может быть фатальным для последующих обновлений (то есть возможны конфиликты в будущем). Так что полухак тогда уж.

Жаль что лучше варианта пока нет.

skrudjmakdak 03.04.2013 20:36

хотите используйте, хотите нет. дело ваше. и опять у меня есть несколько пунктов..

1. бывают проекты, которые нужно делать в срок. и бывает что приходится лепить что первое на ум придет

2. это мощный фреймворк. НО. каким бы он мощным не был, он все равно ограничен возможностями (как и любой другой). например в новой версии появился метод getX() определение положения по X, а вот в ранних версиях этого метода не было. и что делать если он нужен?? выкручиваться разными способами.

3. В каком месте были произведены серьезные изменения? поменял цсс и изменения серьезные??))) я хочу показать еще один пример где они применяют шаблоны:
http://docs.sencha.com/ext-js/4-2/ex...-dataview.html
в данном примере демонстрируется не только применение цсс но и верстка(шаблон)

просто при таком подходе как у вас к созданию проекта, вы будете долго его писать.

p.s. в любом случае ЛЮБОЙ проект сразу конфеткой не станет. надо его написать, а потом модернизировать(убедился на собственной шкуре)

khusamov 03.04.2013 21:00

Полностью согласен по всем пунктам)))
Но напомню, что изначально-то вопрос был по документации (типа может я не доглядел где).
А так да, придется выкручиваться как вы и написали.

По поводу третьего пункта: у меня этих хаков и полухаков уже вагон и маленькая тележка. Конечно хочется без хаков обходиться.

Кстати, в примере там не грид же. Там используется Ext.view.View, который изначально задуман для использования верстки.

skrudjmakdak 03.04.2013 22:15

Без хаков никуда. яж говорю, что любой фреймворк имеет границы.. и приходится лепить что то невероятное.. если задача выходит за эти границы..

ну если лепить как вы говорите без хаков, то могу предложишь поюзать последний мною вариант, т.к. я больше не знаю что еще можно подсказать.. (тоже не так как вы хотите) вот ссылка:
http://docs.sencha.com/ext-js/4-2/ex...d/binding.html


Часовой пояс GMT +3, время: 22:24.