web-dev-qa-db-fra.com

Ajouter du texte d’emplacement réservé HTML5 à une zone de texte .net

J'ai une entrée standard:

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

Je voudrais avoir ce rendu avec un espace dynamique HTML5 . Quelque chose comme:

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

Pour qu'il génère le code HTML suivant:

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

où Site.Name = "Site # 1".

txtSearchTerm. espace réservé n'est pas une propriété. Je l’ai réglé sur texte, puis javascript pour afficher/masquer le focus, MAIS je préférerais de loin utiliser la valeur d’espace réservé HTML5. Comment puis-je rendre cela?

S'il vous plaît pas de solutions côté client/JS.

asp.net.netvb.nethtml5
23
tiffylou

Vous pouvez utiliser la collection Attributes. Donc, vous auriez quelque chose comme

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

ou

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

Et si vous utilisez des ressources pour la localisation/traduction:

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

Parce que je trouve ennuyeux/fastidieux d’ajouter tous les espaces réservés du code derrière. Vous pouvez créer une nouvelle classe TextBox qui hérite de la zone de texte WebControls, puis vous pouvez ajouter un espace réservé à partir de CodeBehind ou de HTML.

TextBox.cs (placé dans 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);
        }
    }
}

Enregistrer le contrôle Dans le Web.Config: 

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

(utilisez le préfixe de balise que vous voulez)

Utilisation: 

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

ou du code derrière

SomeId.PlaceHolder="This is a PlaceHolder";
19
Tony

Je viens de mettre la propriété placeholder dans le code HTML et travaille:

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

Il existe également une extension TextBoxWatermark incluse dans la boîte à outils Ajax Control de Microsoft. Ce n'est pas HTML5, mais c'est rétrocompatible (je crois) . 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