CODEWITHSUNDEEP
html.netasp-classicdotnetnuke
Kluong
Kluong

Reputation: 302

How do you add the title attribute to dnn controls in dotnetnuke?

How do you add the title attribute to the DNN:Label control and have it render as a title attribute, <label title="myTitle">, in html?

Here is my code:

<div class="dnnFormItem">
  <dnn:label id="lblDateNeeded" runat="server" controlname="DateNeeded" resourcekey="DateNeeded" />
  <dnn:dnndatepicker runat="server" cssclass="dnnFormInput" id="DateNeeded" skin="Office2010Silver">
    <Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" Skin="Office2010Silver"></Calendar>
    <DateInput DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy" LabelWidth="40%"></DateInput>
    <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton>
  </dnn:dnndatepicker>
</div>

Upvotes: 1

Views: 712

Answers (2)

RacerNerd
RacerNerd

Reputation: 1577

The title attribute is not accessible in the DNN label. As the OP noted, if specified as an attribute in the front end code, it will be ignored in the output HTML. Furthermore, if added in the code behind using YOURLABEL.Attributes.Add(), it will also be ignored.

Since it is not possible using the properties of the DNN label, another option is needed. One option is to address the issue with JQuery.

The HTML output by the DNN label looks like this:

<div class="dnnLabel">
  <label>
    <span id="#ASP_PATH#_#YOURID#">Test Label</span>
  </label>
</div>

The following JQuery will set the title attribute of the label based on the text in the SPAN:

$('label').each(function () { $(this).attr('title', $(this).text().trim()); })

Running this produced the following changes to the HTML:

<div class="dnnLabel">
  <label title="Test Label">
    <span id="#ASP_PATH#_#YOURID#">Test Label</span>
  </label>
</div>

This function runs over all labels on the page. The JQuery selector could be modified to identify the labels you need to modify, if it's not everything on the page.

This may not produce the exact output you are looking for but you have plenty of flexibility with the JQuery function. If you need to set a special value for the label and you know what the text is going to be, you could use an if or switch to identify the specific label and process it accordingly.

Upvotes: 0

MarceloBarbosa
MarceloBarbosa

Reputation: 915

this.Page.Title = "My Custom Title";

However, in DotNetNuke this will only work in the Page_PreRender method (verified in DotNetNuke 6.2.3).

If you want to set it earlier, you must still use this method which boils down to this:

((DotNetNuke.Framework.CDefault)this.Page).Title = "My Custom Title";

The above will work in Page_Load, Page_Init and Page_PreRender.

If you want to modularize it more, you can add the following in your base class for your modules (a good idea to always do this):

public DotNetNuke.Framework.CDefault BasePage {
    get { return (DotNetNuke.Framework.CDefault)this.Page; }
}

And then simply use:

this.BasePage.Title = "My Custom Title";

The great thing about this method is that you can use it for the meta description and keywords as well.

this.BasePage.Description = "My Custom Description";
this.BasePage.Keywords = "My Custom Keywords";

Source

Upvotes: 1

Related Questions