18.08.2012, 17:17
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Растягивание textarea - заполнение доступной высоты в окне
Может кто подскажет - есть всплывающее окно, с возможностью ресайза, в окне содержится форма (FormPanel), layout у формы естественно form, форма состоит из нескольких полей. последнее поле (textarea) нужно сделать чтобы заполняло всю доступную оставшуюся высоту - тоесть растягиваем мышкой высоту окна и образовавшееся пространство внизу заполняет textarea.
Знаю уже что нужно использовать anchor каким-то образом, но ничего не получается - если прописать для textarea anchor: '100% -50' то текстовое поле растягивается по высоте, словно других полей и нет, и таким образом уходит далеко за пределы окна вниз.
для окна я прописал layout: 'anchor', а для формы - anchor: '100% 100%' таки образом форма занимает всю высоту окна. в visual studio элемент формы можно спокойно заанкорить к верху и низу, но там, можно сказать абсолютное позиционирование, а extjs не использует его (по крайней мере по умолчанию)
|
|
18.08.2012, 20:28
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
<script type="text/javascript" src="http://yandex.st/jquery/1.7.2/jquery.min.js"></script>
<div id=Wrap style="position:fixed;z-index:1200;top:120px;left:0;border:red solid 2px;width:80%;height:430px;max-height:430px;">
aaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
saaaaaaaaaaaaaaaaaassssssssssssssssssss<br>
<div id=clear style="border:red solid 1px;width:100%;height:3px"></div>
<textarea id="MyTex" style="border:blue solid 1px;width:100%;"></textarea>
</div>
<script type="text/javascript">
var delta = 12;
function resizTextar() {
heitTex=$('#Wrap').height()-$('#clear').position().top-delta;
$('#Wrap #MyTex').css({"height":heitTex})
}resizTextar();
</script>
При растягивании div - обращаемся к функции resizTextar()
|
|
18.08.2012, 23:13
|
|
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,585
|
|
Deff,
При чём тут глупое jqйery, вас про ExtJS спрашивают.
__________________
29375, 35
|
|
18.08.2012, 23:16
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
Aetae,
|
|
19.08.2012, 06:15
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
В общем, вопрос можно закрыть.
Решил путем компенсации высоты за счет большого отступа от низа, равного суммарной высоте остальных полей, например anchor: '100% -300' - и поле не вылазиит за пределы окна. Правда для каждого окна придется прописывать разное значение, ибо в каждом окне разный набор полей.
Но при layout: 'form' это наверное единственное решение - этот лэйаут не очень гибкий в плане позиционирования, зато сам отрисовывает лэйблы полей. Подругому наверное только layout: 'absolute' и прописывать жестко высоту и положение x/y каждого элемента (типа как в VCL получится, например как в Visual Studio )
|
|
19.08.2012, 10:43
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
danik.js,
Есть плагин в Инете - растягивающий textarea - а не div
Тогда просто делаете у дива автовысоту - а растяжение textarea будет автоувеличивать и высоту div до нужных размеров
Вот пример http://s1.uploads.ru/i/IZhHA.png
http://hostjs-mybb2011.narod.ru/SmiliesBoxes2.htm
А в Moзилле и Гугле вроде свойство такое есть по умолчанию
|
|
19.08.2012, 12:38
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Deff, вопрос задан в контексте ExtJS, поэтому решение должно быть специфичным и не требовать каких-то плагинов (тем более что все элементы целиком генерируются extjs'ом - исходный html код - пустой)
Собственно, я предположил что кто-то уже работал с extjs и имел счастье решать подобную проблему...
Возможно это решается через хитроумное сплетение всяких там панелей с причудливыми layout параметрами...
Последний раз редактировалось danik.js, 19.08.2012 в 12:40.
|
|
19.08.2012, 12:40
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
Последний раз редактировалось Deff, 19.08.2012 в 13:00.
|
|
19.08.2012, 13:43
|
С++/C# modest developer
|
|
Регистрация: 07.11.2011
Сообщений: 244
|
|
Сообщение от danik.js
|
Решил путем компенсации высоты за счет большого отступа от низа, равного суммарной высоте остальных полей, например anchor: '100% -300' - и поле не вылазиит за пределы окна. Правда для каждого окна придется прописывать разное значение, ибо в каждом окне разный набор полей.
|
Ну на самом деле вы правельно сделали, в документации есть пример, в котором решение схоже с вашим, но насчет плохой гибкости решения я с вами соглашусь. Возможно есть лучшее решение, нужно экспериментировать))
Сообщение от Aetae
|
...вас про ExtJS спрашивают.
|
Сообщение от danik.js
|
Deff, вопрос задан в контексте ExtJS
|
Добавлю только то что копать сгенеренный фреймворком dom и пытаться там что-то изменить, это все равно что разобрать космическую станцию ради одного винтика.
|
|
|
|