Добавьте текст-заполнитель HTML5 в текстовое поле .net

У меня есть стандартный ввод:

<asp:TextBox type="text" runat="server" id="txtSearchTerm" />

Я хотел бы иметь этот рендер с динамическим HTML5 placeholder. Что-то вроде:

'Code Behind
txtSearchTerm.**placeholder** = "Search " + Site.Name

Чтобы он выводил следующий HTML-код:

<input type="text" runat="server" id="txtSearchTerm" 
placeholder="Search Site #1" />

где Site.Name = "Сайт № 1".

txtSearchTerm. placeholder не является свойством. Я настроил его на текст, а затем запустил javascript, чтобы показать/скрыть в фокусе, но я бы скорее просто использовал значение placeholder HTML5. Как это сделать?

Пожалуйста, не поддерживайте JS/клиентские решения.

Ответ 1

Вы можете использовать коллекцию Attributes. Таким образом, у вас будет что-то вроде

txtSearchTerm.Attributes.Add("placeholder", "Search" + Site.Name);

или

txtSearchTerm.Attributes["placeholder"] = "Search" + Site.Name; // or Attributes("placeholder") if you're using vb.net

И если вы используете ресурсы для локализации/перевода:

txtSearchTerm.Attributes["placeholder"] = GetLocalResourceObject("YourLocalResourceName").ToString();

Ответ 2

Потому что я нахожу это раздражающим/утомительным, чтобы добавить все заполнители из кода позади. Вы можете создать новый класс TextBox, который наследует TextBox WebControls, а затем вы можете добавить placeholder из CodeBehind или со стороны HTML.

TextBox.cs(размещен в Project/Controls/)

namespace Project.Controls
{
    public class TextBox : System.Web.UI.WebControls.TextBox
    {
        public string PlaceHolder { get; set; }

        protected override void OnLoad(EventArgs e)
        {
            if(!string.IsNullOrWhiteSpace(PlaceHolder))
                this.Attributes.Add("placeholder", PlaceHolder);

            base.OnLoad(e);
        }
    }
}

Управление регистрацией в Web.Config:

  <system.web>
    <pages>
      <controls>
        <add tagPrefix="ext" assembly="Project" namespace="Project.Controls" />
      </controls>
    </pages>
  </system.web>

(используйте любой префикс тега, который вы хотите)

Применение:

<ext:TextBox runat="server" id="SomeId" PlaceHolder="This is a PlaceHolder" />

или из кода, стоящего за

SomeId.PlaceHolder="This is a PlaceHolder";

Ответ 3

Я просто добавляю свойство placeholder в код HTML и работает:

<asp:TextBox placeholder="hola mundo" ID="some_id" runat="server"/>

Ответ 4

Существует также расширитель TextBoxWatermark, включенный в набор инструментов Microsoft Ajax Control. Это не HTML5, но он обратно совместим (я считаю). http://www.asp.net/AjaxLibrary/AjaxControlToolkitSampleSite/TextBoxWatermark/TextBoxWatermark.aspx

<ajaxToolkit:TextBoxWatermarkExtender ID="TBWE2" runat="server"
    TargetControlID="TextBox1"
    WatermarkText="Type First Name Here"
    WatermarkCssClass="watermarked" />