Я пытаюсь создать изменяемый размер текстового поля (многострочный ASP.NET TextBox
/HTML textarea
) и использовать пользовательский интерфейс JQuery, чтобы сделать его изменяемым по размеру, но, похоже, работает с несколькими проблемами, связанными с пользовательскими ручками перетаскивания.
Документация JQuery по методу Resizable
(в частности, на handles
) указывает, что я могу установить любой из дескрипторов для использования пользовательского элемента HTML. Мне удалось получить текстовое поле с изменяемым размером, прекрасно работающим с помощью стандартных изменяемых по умолчанию ручек, но попытка установить пользовательские (т.е. Элемент HTML, который я определил в разметке) создает следующую проблему: размерный контейнер оставляет правильное пространство для ручка div
внизу (для южного дескриптора), но оставляет пустое пространство и показывает элемент ниже (вне) контейнера с изменяемым размером (проверено с использованием Firebug).
Вот моя разметка (ASP.NET/XHTML) и код JavaScript:
<asp:TextBox runat="server" ID="codeTextBox" TextMode="MultiLine" Wrap="false" Rows="15">
</asp:TextBox>
<div class="resizable-s" style="width: 100%; height: 22px; background: red;">
</div>
<script type="text/javascript">
$(function() {
var codeTextBox = $("#<%= codeTextBox.ClientID %>");
codeTextBox.resizable({
handles: { s : $(".resizable-s") },
minHeight: 80,
maxHeight: 400
});
});
</script>
Конечно, я не могу сделать resizable handle div (class resizable-s
) дочерним элементом TextBox
/textarea
, но это не должно быть проблемой в соответствии с документами JQuery.
Судя по поиску, который я сделал, я не единственный человек, у которого была эта проблема. (К сожалению, в документах JQuery нет примера использования настраиваемых изменяемых размеров ручек, поэтому мы все не уверены в правильности кода.) Если кто-нибудь может предложить исправить это или действительно подтвердить, что это ошибка JQuery, это было бы очень оценено.