Изменяемый размер текстового поля / области - PullRequest
Новая
       35

Изменяемый размер текстового поля / области

1 голос
/ 24 августа 2011

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

<table>
  <tr>
    <td>
      <Grid>
    </td>
    <td>
      <TextArea>
    </td>
  </tr>
</table>

Между этой сеткой и текстовой областью должна быть линия, поэтому, если я расширяю одну, другая сокращается, и наоборот.Я экспериментировал с некоторыми jQuery, но я думаю, что был бы простой элемент управления asp.net, который мог бы достичь этого.Кто-нибудь знает, что я мог бы использовать для этой, казалось бы, простой задачи?

Спасибо

Ответы [ 3 ]

1 голос
/ 24 августа 2011

AjaxControlToolkit имеет удлинитель ResizableControl - см. http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/ResizableControl/ResizableControl.aspx

Чтобы использовать это, вы должны загрузить AjaxControlToolkit и добавить ссылку на него в свой проект. Вам также необходимо зарегистрировать элементы управления, которые он вам дает, вы можете сделать это на отдельных страницах, если хотите использовать директиву <% Register в верхней части страницы ASPX, но в настоящее время я считаю, что самый простой способ - это зарегистрировать его в web.config. Добавьте этот блок в ваш web.config в разделе <system.web>: 

<pages>
    <controls>
        <add tagPrefix="ajaxtoolkit" namespace="AjaxControlToolkit" assembly="AjaxControlToolkit" /> 
    </controls>
</pages>

А затем на своей странице вы добавляете расширитель к вашей сетке следующим образом: 

<asp:gridview id="MyGridView" ... >
</asp:gridview>
<ajaxtoolkit:ResizableControlExtender TargetControlId="MyGrid" />
<hr/>
<asp:textbox id="MyTextArea" ... />

Исходя из вашего вопроса, я думаю, что вы хотите изменить размер только по вертикали, поэтому вы хотите установить для свойств MinimumWidth и MaximumWidth одинаковое значение. Хитрость может заключаться в уменьшении размера одного при увеличении размера другого, хотя расширитель предоставляет вам события, в которые вы можете подключить некоторый JavaScript, который вполне может это сделать.

1 голос
/ 24 августа 2011

Как насчет jQuery UI Resizable?

Проверьте это: http://jqueryui.com/resizable/#textarea

Вот вся страница.Вы можете проверить некоторые опции, которые имеет изменяемый размер. 

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Resizable - Textarea</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <style>
  .ui-resizable-se {
    bottom: 17px;
  }
  </style>
  <script>
  $(function() {
    $( "#resizable" ).resizable({
      handles: "se"
    });
  });
  </script>
</head>
<body>

<textarea id="resizable" rows="5" cols="20"></textarea>


</body>
</html>
0 голосов
/ 10 сентября 2011

Я сделал это с помощью Telerik.RadSplitter

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...