Skip to content

Commit c35e726

Browse files
authored
Feature data list - Additional style and attributes (#20)
* Added Style attribute * Added Tooltip attribute * Added UseAccessibleHeader attribute * Added Font attributes and the Caption attributes for #19 * Added cellpadding and cellspacing features #19
1 parent 9cf2e3b commit c35e726

30 files changed

+851
-141
lines changed

docs/DataList.md

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,23 @@ The DataList component is meant to emulate the asp:DataList control in markup an
77
## Features supported in Blazor
88

99
- Flow Layout
10-
- Single Column
1110
- Empty List
12-
- Table Layout
11+
- FooterStyle
12+
- FooterTemplate
13+
- HeaderStyle
14+
- HeaderTemplate
15+
- Tooltip
1316
- Single Column
17+
- Table Layout
18+
- Accessible Headers
1419
- Empty List
20+
- FooterStyle
21+
- FooterTemplate
22+
- HeaderStyle
23+
- HeaderTemplate
24+
- Tooltip
25+
- Single Column
26+
- Tooltip
1527

1628
##### [Back to top](#datalist)
1729

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
@page "/ControlSamples/DataList/ComplexStyle"
2+
@using static System.Drawing.Color
3+
@using static BlazorWebFormsComponents.Enums.BorderStyle
4+
5+
<h2>DataList HeaderStyle sample</h2>
6+
7+
<Nav />
8+
9+
<p>Here is a simple datalist bound to a collection of widgets with simple HeaderStyle applied</p>
10+
11+
<DataList @ref="simpleDataList"
12+
runat="server"
13+
EnableViewState="false"
14+
BackColor="Gray"
15+
BorderColor="Firebrick"
16+
BorderStyle="Groove"
17+
BorderWidth="2"
18+
Context="Item"
19+
ItemType="SharedSampleObjects.Models.Widget">
20+
<HeaderTemplate>Simple Widgets</HeaderTemplate>
21+
<ItemTemplate>
22+
@Item.Name - @Item.Price.ToString("c")
23+
</ItemTemplate>
24+
</DataList>
25+
26+
@code {
27+
28+
BlazorWebFormsComponents.DataList<Widget> simpleDataList { get; set; }
29+
30+
protected override void OnAfterRender(bool firstRender)
31+
{
32+
33+
if (firstRender)
34+
{
35+
simpleDataList.DataSource = Widget.SimpleWidgetList;
36+
simpleDataList.DataBind();
37+
}
38+
39+
//base.OnParametersSet();
40+
base.OnAfterRender(firstRender);
41+
42+
}
43+
44+
IQueryable<Widget> GetWidgets(int maxRows, int startRowIndex, string sortByExpression, out int totalRowCount)
45+
{
46+
47+
totalRowCount = Widget.SimpleWidgetList.Length;
48+
49+
return Widget.SimpleWidgetList.AsQueryable();
50+
51+
}
52+
53+
54+
}
55+

samples/AfterBlazorServerSide/Pages/ControlSamples/DataList/Nav.razor

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,6 @@
22
Other usage samples:
33
<NavLink href="/ControlSamples/DataList" class="component-link" Match="NavLinkMatch.All">Simple Table</NavLink> |
44
<NavLink href="/ControlSamples/DataList/Flow" class="component-link" Match="NavLinkMatch.All">Simple Flow</NavLink> |
5-
<NavLink href="/ControlSamples/DataList/HeaderStyle" class="component-link" Match="NavLinkMatch.All">Header Style</NavLink>
5+
<NavLink href="/ControlSamples/DataList/HeaderStyle" class="component-link" Match="NavLinkMatch.All">Header Style</NavLink> |
6+
<NavLink href="/ControlSamples/DataList/ComplexStyle" class="component-link" Match="NavLinkMatch.All">Complex Style</NavLink>
67
</div>

samples/AfterBlazorServerSide/Pages/ControlSamples/ListView/ModelBinding.razor

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,6 @@
4343
</tr>
4444
</EmptyDataTemplate>
4545
</ListView>
46-
<tr runat="server" id="itemPlaceHolder"></tr>
4746
</tbody>
4847
</table>
4948

samples/BeforeWebForms/BeforeWebForms.csproj

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,7 @@
108108
<Content Include="Content\bootstrap.css" />
109109
<Content Include="Content\bootstrap.min.css" />
110110
<Content Include="Content\Site.css" />
111+
<Content Include="ControlSamples\DataList\StyleAttributes.aspx" />
111112
<Content Include="ControlSamples\DataList\FlowLayout.aspx" />
112113
<Content Include="ControlSamples\DataList\Default.aspx" />
113114
<Content Include="ControlSamples\ListView\Default.aspx" />
@@ -163,6 +164,13 @@
163164
<ItemGroup>
164165
<Compile Include="App_Start\BundleConfig.cs" />
165166
<Compile Include="App_Start\RouteConfig.cs" />
167+
<Compile Include="ControlSamples\DataList\StyleAttributes.aspx.cs">
168+
<DependentUpon>StyleAttributes.aspx</DependentUpon>
169+
<SubType>ASPXCodeBehind</SubType>
170+
</Compile>
171+
<Compile Include="ControlSamples\DataList\StyleAttributes.aspx.designer.cs">
172+
<DependentUpon>StyleAttributes.aspx</DependentUpon>
173+
</Compile>
166174
<Compile Include="ControlSamples\DataList\FlowLayout.aspx.cs">
167175
<DependentUpon>FlowLayout.aspx</DependentUpon>
168176
<SubType>ASPXCodeBehind</SubType>

samples/BeforeWebForms/ControlSamples/DataList/Default.aspx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<h2>DataList control homepage</h2>
66

77
<div>
8-
Other usage samples: <a href="FlowLayout.aspx">FlowLayout Sample</a>
8+
Other usage samples: <a href="FlowLayout.aspx">FlowLayout Sample</a> <a href="StyleAttributes.aspx">Styles</a>
99
</div>
1010

1111
<p>Here is a simple datalist bound to a collection of widgets. By default, the RepeatLayout
@@ -15,6 +15,12 @@
1515
<asp:DataList ID="simpleDataList"
1616
runat="server"
1717
RepeatColumns="2"
18+
ToolTip="This is my tooltip"
19+
UseAccessibleHeader="true"
20+
Caption="This is my caption"
21+
CaptionAlign="Top"
22+
CellPadding="2"
23+
CellSpacing="3"
1824
ItemType="SharedSampleObjects.Models.Widget">
1925
<HeaderStyle CssClass="myClass" Font-Bold="true" Font-Italic="true" Font-Names="arial black" Font-Overline="true" Font-Size="X-Large" Font-Strikeout="true" Font-Underline="true" />
2026
<HeaderTemplate>

samples/BeforeWebForms/ControlSamples/DataList/FlowLayout.aspx

Lines changed: 25 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,33 @@
22

33
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
44

5-
<h2>DataList Flow Layout Sample</h2>
5+
<h2>DataList Flow Layout Sample</h2>
66

7-
<div>
8-
Other usage samples: <a href="Default.aspx">Simple Layout Sample</a>
9-
</div>
7+
<div>
8+
Other usage samples: <a href="Default.aspx">Simple Layout Sample</a> <a href="StyleAttributes.aspx">Styles</a>
9+
</div>
1010

11-
<p>Here is a simple datalist bound to a collection of widgets with RepeatLayout set to Flow</p>
11+
<p>Here is a simple datalist bound to a collection of widgets with RepeatLayout set to Flow</p>
1212

13-
<asp:DataList ID="simpleDataList"
14-
runat="server"
15-
Enabled="true"
16-
RepeatLayout="Flow"
17-
ItemType="SharedSampleObjects.Models.Widget">
18-
<HeaderTemplate>
19-
My Widget List
20-
</HeaderTemplate>
21-
<ItemTemplate>
22-
<%# Item.Name %> <br /> <%# Item.Price.ToString("c") %>
23-
</ItemTemplate>
24-
</asp:DataList>
13+
<asp:DataList ID="simpleDataList"
14+
runat="server"
15+
Enabled="true"
16+
Caption="This is my caption"
17+
CaptionAlign="Top"
18+
CellPadding="2"
19+
CellSpacing="3"
20+
ToolTip="This is my tooltip"
21+
UseAccessibleHeader="true"
22+
RepeatLayout="Flow"
23+
ItemType="SharedSampleObjects.Models.Widget">
24+
<HeaderTemplate>
25+
My Widget List
26+
</HeaderTemplate>
27+
<ItemTemplate>
28+
<%# Item.Name %>
29+
<br />
30+
<%# Item.Price.ToString("c") %>
31+
</ItemTemplate>
32+
</asp:DataList>
2533

2634
</asp:Content>
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="StyleAttributes.aspx.cs" Inherits="BeforeWebForms.ControlSamples.DataList.StyleAttributes" %>
2+
3+
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
4+
5+
<h2>DataList Styles</h2>
6+
7+
<div>
8+
Other usage samples: <a href="Default.aspx">Simple Layout Sample</a> <a href="FlowLayout.aspx">FlowLayout Sample</a>
9+
</div>
10+
11+
<p>Here is a simple datalist bound to a collection of widgets. We're testing and showing the various
12+
style attributes that can be set on the DataList
13+
</p>
14+
15+
<asp:DataList ID="simpleDataList"
16+
runat="server"
17+
RepeatColumns="2"
18+
ToolTip="This is my tooltip"
19+
AccessKey="S"
20+
BackColor="Gray"
21+
BorderStyle="Solid"
22+
BorderWidth="2px"
23+
BorderColor="Firebrick"
24+
Font-Bold="true"
25+
UseAccessibleHeader="true"
26+
ItemType="SharedSampleObjects.Models.Widget">
27+
<HeaderTemplate>
28+
My Widget List
29+
</HeaderTemplate>
30+
<FooterTemplate>End of Line</FooterTemplate>
31+
<ItemTemplate>
32+
<%# Item.Name %>
33+
<br />
34+
<%# Item.Price.ToString("c") %>
35+
</ItemTemplate>
36+
</asp:DataList>
37+
38+
</asp:Content>
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.UI;
6+
using System.Web.UI.WebControls;
7+
8+
namespace BeforeWebForms.ControlSamples.DataList
9+
{
10+
public partial class StyleAttributes : System.Web.UI.Page
11+
{
12+
protected void Page_Load(object sender, EventArgs e)
13+
{
14+
//simpleDataList.DataSource = new SharedSampleObjects.Models.Widget[] { }; // SharedSampleObjects.Models.Widget.SimpleWidgetList;
15+
simpleDataList.DataSource = SharedSampleObjects.Models.Widget.SimpleWidgetList;
16+
simpleDataList.DataBind();
17+
}
18+
}
19+
}

samples/BeforeWebForms/ControlSamples/DataList/StyleAttributes.aspx.designer.cs

Lines changed: 26 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)