Implemented LayoutTemplate on ListView (#34)

* Set version to 0.4.0-preview1

* Introducing the 4 Web Forms event handlers for all components

* Added OnDataBinding and OnDataBound event handlers

* Added ItemDataBound event

* Implement LayoutTemplate (#32)

Co-authored-by: SQL-MisterMagoo <[email protected]>

Author: csharpfritz

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

@@ -2,9 +2,7 @@
 
 <h2>ListView Component homepage</h2>
 
-<div>
-	Other usage samples:  <a href="./ControlSamples/ListView/ModelBinding">ModelBinding Sample</a>
-</div>
+<Nav />
 
 <p>Here is a simple listview bound to a collection of widgets.</p>
 

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

@@ -0,0 +1,66 @@
+@page "/ControlSamples/ListView/LayoutTest"
+
+<h2>ListView Component homepage</h2>
+
+<Nav />
+
+<p>Testing a layout for the ListView</p>
+
+		<ListView @ref="simpleListView"
+							runat="server"
+							EnableViewState="false"
+							Context="Item"
+							ItemPlaceholderID="foo"
+							ItemType="SharedSampleObjects.Models.Widget">
+			<ItemTemplate>
+				<tr>
+					<th>@Item.Id</th>
+					<td>@Item.Name</td>
+					<td>@Item.Price.ToString("c")</td>
+					<td>@Item.LastUpdate.ToString("d")</td>
+				</tr>
+			</ItemTemplate>
+			<AlternatingItemTemplate>
+				<tr class="bg-light">
+					<th>@Item.Id</th>
+					<td>@Item.Name</td>
+					<td>@Item.Price.ToString("c")</td>
+					<td>@Item.LastUpdate.ToString("d")</td>
+				</tr>
+			</AlternatingItemTemplate>
+			<LayoutTemplate Context="itemPlaceHolder">				
+				<table class="table" id="robert">
+					<thead>
+						<tr>
+							<th>Id</th>
+							<th>Name</th>
+							<th>Price</th>
+							<th>Last Update</th>
+						</tr>
+					</thead>
+					<tbody>
+						@itemPlaceHolder
+					</tbody>
+				</table>
+			</LayoutTemplate> 
+		</ListView>
+
+@code {
+
+		BlazorWebFormsComponents.ListView<Widget> simpleListView { get; set; }
+
+		protected override void OnAfterRender(bool firstRender)
+		{
+			base.OnAfterRender(firstRender);
+
+			if (firstRender)
+			{
+				simpleListView.DataSource = Widget.SimpleWidgetList;
+				simpleListView.DataBind();
+			}
+
+			//base.OnParametersSet();
+
+		}
+}
+

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

@@ -2,6 +2,8 @@
 
 <h2>ListView ModelBinding Sample</h2>
 
+<Nav />
+
 <p>Here is a listview using ModelBinding to interact with widgets.</p>
 
 <table class="table">
@@ -51,7 +53,8 @@
 
 	ListView<Widget> simpleListView;
 
-	IQueryable<SharedSampleObjects.Models.Widget> simpleListView_GetData(int max, int start, string sort, out int totalRowCount) {
+	IQueryable<SharedSampleObjects.Models.Widget> simpleListView_GetData(int max, int start, string sort, out int totalRowCount)
+	{
 
 		var outCollection = Widget.SimpleWidgetList.AsQueryable();
 		totalRowCount = outCollection.Count();

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

@@ -0,0 +1,6 @@
+<div>
+	Other usage samples:
+	<NavLink href="/ControlSamples/ListView" class="component-link" Match="NavLinkMatch.All">Simple List View </NavLink> |
+	<NavLink href="./ControlSamples/ListView/ModelBinding" class="component-link" Match="NavLinkMatch.All">ModelBinding Sample</NavLink>
+	<NavLink href="./ControlSamples/ListView/LayoutTest" class="component-link" Match="NavLinkMatch.All">Layout Test</NavLink>
+</div>

src/BlazorWebFormsComponents.Test/ListView/DataBindingEvents.razor

@@ -0,0 +1,51 @@
+@inherits TestComponentBase
+
+<Fixture
+	Test="FirstTest"
+>
+<ComponentUnderTest>
+	<ListView Items="Widget.SimpleWidgetList"
+						ItemType="Widget"
+						OnDataBinding="DataBinding"
+						OnDataBound="DataBound"
+						OnItemDataBound="ItemDataBound"
+						Context="Item">
+		<ItemTemplate><span>@Item.Name</span></ItemTemplate>
+	</ListView>
+</ComponentUnderTest>
+</Fixture>
+
+
+@code {
+
+	int databinding = 0;
+	int databound = 0;
+	int itemDatabound = 0;
+
+	void FirstTest(IRazorTestContext context)
+	{
+
+		var cut = context.GetComponentUnderTest();
+
+		databinding.ShouldBeGreaterThan(0);
+		databound.ShouldBeGreaterThan(0);
+		itemDatabound.ShouldBeGreaterThanOrEqualTo(3);
+
+		cut.FindAll("span").Count().ShouldBe(3);
+
+	}
+
+	void DataBinding(EventArgs args) {
+		databinding++;
+	}
+
+	void DataBound(EventArgs args) {
+		databound++;
+	}
+
+	void ItemDataBound(ListViewItemEventArgs args) {
+		itemDatabound++;
+	}
+
+
+}

src/BlazorWebFormsComponents.Test/ListView/Layout.razor

@@ -0,0 +1,37 @@
+@inherits TestComponentBase
+
+<Fixture
+	Test="FirstTest"
+>
+<ComponentUnderTest>
+	<ListView Items="Widget.SimpleWidgetList"
+						ItemType="Widget"
+						Context="Item">
+		<ItemTemplate><span>@Item.Name</span></ItemTemplate>
+		<LayoutTemplate Context="itemPlaceholder">
+			<div>
+				<b>Header</b>
+				<br/>
+				@itemPlaceholder
+			</div>
+		</LayoutTemplate>
+	</ListView>
+</ComponentUnderTest>
+</Fixture>
+
+
+@code {
+
+	void FirstTest(IRazorTestContext context)
+	{
+
+		var cut = context.GetComponentUnderTest();
+
+		cut.FindAll("span").Count().ShouldBe(3);
+		cut.FindAll("div").Count().ShouldBe(1);
+		cut.FindAll("b").Count().ShouldBe(1);
+
+	}
+
+
+}

src/BlazorWebFormsComponents.Test/ListView/WebFormsEvents.razor

@@ -0,0 +1,75 @@
+@inherits TestComponentBase
+
+<Fixture
+	Test="FirstTest"
+>
+<ComponentUnderTest>
+	<ListView Items="Widget.SimpleWidgetList" @ref="theListView"
+						ItemType="Widget"
+						OnInit="Init"
+						OnLoad="Load"
+						OnPreRender="PreRender"
+						OnUnload="Unload"
+						OnDisposed="MyDispose"
+						Context="Item">
+		<ItemTemplate><span>@Item.Name</span></ItemTemplate>
+	</ListView>
+</ComponentUnderTest>
+</Fixture>
+
+
+@code {
+
+	ListView<Widget> theListView;
+
+	int initialized = 0;
+	int loaded = 0;
+	int preRendered = 0;
+	int unloaded = 0;
+
+	bool disposed = false;
+
+	void FirstTest(IRazorTestContext context)
+	{
+
+		var cut = context.GetComponentUnderTest();
+
+		initialized.ShouldBe(1);
+		loaded.ShouldBe(1);
+		preRendered.ShouldBe(1);
+		unloaded.ShouldBe(1);
+
+		cut.FindAll("span").Count().ShouldBe(3);
+
+		theListView.DisposeAsync().GetAwaiter().GetResult();
+
+		disposed.ShouldBeTrue();
+
+	}
+
+	void Init(EventArgs args)
+	{
+		initialized++;
+	}
+
+	void Load(EventArgs args)
+	{
+		loaded++;
+	}
+
+	void PreRender(EventArgs args)
+	{
+		preRendered++;
+	}
+
+	void Unload(EventArgs args)
+	{
+		unloaded++;
+	}
+
+	void MyDispose(EventArgs args) {
+		disposed = true;
+	}
+
+
+}

src/BlazorWebFormsComponents/BaseModelBindingComponent.cs

@@ -57,6 +57,19 @@ protected override void OnAfterRender(bool firstRender)
 
 		protected virtual void HandleUnknownAttributes() { }
 
+		#region Data Binding Events
+
+		[Parameter]
+		public EventCallback<EventArgs> OnDataBinding { get; set; }
+
+		[Parameter]
+		public EventCallback<EventArgs> OnDataBound { get; set; }
+
+		[Parameter]
+		public EventCallback<ListViewItemEventArgs> OnItemDataBound { get; set; }
+
+		#endregion
+
 	}
 
 }