AdRotator
The AdRotator component is meant to emulate the asp:AdRotator control in markup and is defined in the System.Web.UI.WebControls.AdRotator class
Blazor Features Supported¶
XML File-Based Advertisement¶
AdvertisementFile- The path to an XML file that contains advertisement information.Target- The name of the browser window or frame that displays the contents of the Web page linked to when the AdRotator component is clicked.KeywordFilter- Filter advertisements by keyword.AlternateTextField- The field name in the data source that provides alternate text for the ad image (default: "AlternateText").ImageUrlField- The field name in the data source that provides the image URL (default: "ImageUrl").NavigateUrlField- The field name in the data source that provides the navigation URL (default: "NavigateUrl").
Data Binding¶
DataSource- Bind to a collection ofAdvertismentobjects programmatically. When using DataSource, you can provide aList<Advertisment>or other collection types.DataMember- Specifies the data table within a DataSet to bind to when using complex data sources.OnDataBound- Event fired after the data has been bound to the control.
Events¶
OnAdCreated- Event fired when an advertisement is created, allowing you to modify ad properties before rendering.
Styling¶
- Standard Web Forms styling properties:
BackColor,ForeColor,BorderColor,BorderStyle,BorderWidth,CssClass,Font,Height,Width.
Usage Examples¶
Using XML Advertisement File¶
XML File Format (Ads.xml):
<Advertisements>
<Ad>
<ImageUrl>~/images/ad1.jpg</ImageUrl>
<NavigateUrl>http://www.example1.com</NavigateUrl>
<AlternateText>Visit Example 1</AlternateText>
<Width>468</Width>
<Height>60</Height>
<Keyword>technology</Keyword>
<Impressions>80</Impressions>
</Ad>
<Ad>
<ImageUrl>~/images/ad2.jpg</ImageUrl>
<NavigateUrl>http://www.example2.com</NavigateUrl>
<AlternateText>Visit Example 2</AlternateText>
<Width>468</Width>
<Height>60</Height>
<Keyword>sports</Keyword>
<Impressions>20</Impressions>
</Ad>
</Advertisements>
Using DataSource with List of Advertisements¶
@code {
private List<Advertisment> _ads = new()
{
new Advertisment
{
ImageUrl = "/images/tech-ad.jpg",
NavigateUrl = "http://www.techsite.com",
AlternateText = "Visit Tech Site",
Width = "468",
Height = "60",
Keyword = "technology"
},
new Advertisment
{
ImageUrl = "/images/sports-ad.jpg",
NavigateUrl = "http://www.sportssite.com",
AlternateText = "Visit Sports Site",
Width = "468",
Height = "60",
Keyword = "sports"
}
};
}
<AdRotator DataSource="@_ads" Target="_blank" />
Using KeywordFilter¶
Filter advertisements by keyword:
Or with DataSource:
Handling OnAdCreated Event¶
Modify advertisement properties before rendering:
<AdRotator AdvertisementFile="Ads.xml" OnAdCreated="HandleAdCreated" />
@code {
private void HandleAdCreated(AdCreatedEventArgs e)
{
// Modify the ad before it's rendered
e.AlternateText = $"Special Offer: {e.AlternateText}";
// Access all ad properties
var imageUrl = e.ImageUrl;
var navigateUrl = e.NavigateUrl;
// Access additional properties via AdProperties dictionary
var keyword = e.AdProperties["Keyword"];
}
}
Handling OnDataBound Event¶
Execute code after data binding:
<AdRotator DataSource="@_ads" OnDataBound="HandleDataBound" />
@code {
private void HandleDataBound(EventArgs e)
{
// Perform actions after data is bound
Console.WriteLine("AdRotator data bound successfully");
}
}
Using with Styling Properties¶
<AdRotator
AdvertisementFile="Ads.xml"
Target="_blank"
CssClass="ad-banner"
BorderWidth="1px"
BorderColor="#cccccc"
BorderStyle="Solid" />
Notes¶
- When both
DataSourceandAdvertisementFileare specified,DataSourcetakes priority. - The AdRotator randomly selects an advertisement from the available pool each time it renders.
- The
Impressionsfield in the XML affects the probability of an ad being shown (ads with higher impression values appear more frequently). - Custom field names can be specified using
AlternateTextField,ImageUrlField, andNavigateUrlFieldproperties.
Web Forms Features NOT Supported¶
DataSourceID- DataSource controls are not used in Blazor. Use theDataSourceproperty instead to bind data programmatically.- Lifecycle events like
OnInit,OnLoad,OnPreRender,OnUnload- These are part of the Web Forms page lifecycle and don't apply to Blazor components. EnableTheming/SkinID- Blazor uses CSS for theming.EnableViewState- Blazor doesn't use ViewState.
Web Forms Declarative Syntax¶
<asp:AdRotator
AccessKey="string"
AdvertisementFile="uri"
AlternateTextField="string"
BackColor="color name|#dddddd"
BorderColor="color name|#dddddd"
BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
Inset|Outset"
BorderWidth="size"
CssClass="string"
DataMember="string"
DataSource="string"
DataSourceID="string"
Enabled="True|False"
EnableTheming="True|False"
EnableViewState="True|False"
ForeColor="color name|#dddddd"
Height="size"
ID="string"
ImageUrlField="string"
KeywordFilter="string"
NavigateUrlField="string"
OnAdCreated="AdCreated event handler"
OnDataBinding="DataBinding event handler"
OnDataBound="DataBound event handler"
OnDisposed="Disposed event handler"
OnInit="Init event handler"
OnLoad="Load event handler"
OnPreRender="PreRender event handler"
OnUnload="Unload event handler"
runat="server"
SkinID="string"
Style="string"
TabIndex="integer"
Target="string|_blank|_parent|_search|_self|_top"
ToolTip="string"
Visible="True|False"
Width="size"
/>