web-dev-qa-db-ja.com

HTML5プレースホルダーテキストをテキストボックス.netに追加する

標準入力があります：

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

ダイナミックHTML5プレースホルダーでこのレンダリングを行いたいです。何かのようなもの：

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

そのため、次のHTMLが出力されます。

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

ここで、Site.Name = "Site＃1"。

txtSearchTerm .プレースホルダーはプロパティではありません。テキストに設定し、javascriptを実行してフォーカスの表示/非表示を切り替えますが、HTML5プレースホルダー値を使用したいだけです。これをどのようにレンダリングできますか？

JS /クライアント側のソリューションはありません。

asp.net.netvb.nethtml5
25
tiffylou

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();
42
Steven V

コードビハインドからすべてのプレースホルダーを追加するのは面倒/面倒だからです。 WebControls TextBoxを継承する新しいTextBoxクラスを作成してから、CodeBehindまたはHTML Sideからプレースホルダーを追加できます。

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";
19
Tony

プレースホルダープロパティをHTMLコードに入れて動作します。

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

また、MicrosoftのAjax Controlツールキットに含まれているTextBoxWatermarkエクステンダーもあります。 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" />
0
mason