update all styles for edit

These will be reused for insert
This commit is contained in:
Bill Wagner 2017-03-22 17:21:13 -04:00
parent e4ee9a7d24
commit 89497e0cac
7 changed files with 56 additions and 31 deletions

View File

@ -56,6 +56,7 @@
<Reference Include="System.Data" /> <Reference Include="System.Data" />
<Reference Include="System.Core" /> <Reference Include="System.Core" />
<Reference Include="System.Data.DataSetExtensions" /> <Reference Include="System.Data.DataSetExtensions" />
<Reference Include="System.Data.Entity" />
<Reference Include="System.Web.Extensions" /> <Reference Include="System.Web.Extensions" />
<Reference Include="System.Xml.Linq" /> <Reference Include="System.Xml.Linq" />
<Reference Include="System.Drawing" /> <Reference Include="System.Drawing" />

View File

@ -18,3 +18,7 @@
text-align: right; text-align: right;
width: 100%; width: 100%;
} }
.table-full-width {
width: 100%;
}

View File

@ -4,7 +4,7 @@
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> <asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<asp:ListView ID="catalogList" runat="server" <asp:ListView ID="catalogList" runat="server"
DataKeyNames="Id" GroupItemCount="3" DataKeyNames="Id" GroupItemCount="3"
ItemType="eShopOnContainers.Core.Models.Catalog.CatalogItem" SelectMethod="catalogList_GetData" DeleteMethod="catalogList_DeleteItem"> ItemType="eShopOnContainers.Core.Models.Catalog.CatalogItem" SelectMethod="GetCatalogDataAsync" DeleteMethod="DeleteCatalogItemAsync">
<EmptyDataTemplate> <EmptyDataTemplate>
<div class="row"> <div class="row">
<span class="col-md-10 col-md-offset-1">There's nothing in the catalog to display at this time. <span class="col-md-10 col-md-offset-1">There's nothing in the catalog to display at this time.

View File

@ -33,13 +33,13 @@ namespace eShopOnContainers.Catalog.WebForms
// int startRowIndex // int startRowIndex
// out int totalRowCount // out int totalRowCount
// string sortByExpression // string sortByExpression
public async Task<IEnumerable<CatalogItem>> catalogList_GetData() public async Task<IEnumerable<CatalogItem>> GetCatalogDataAsync()
{ {
return await catalog?.GetCatalogAsync(); return await catalog?.GetCatalogAsync();
} }
// The id parameter name should match the DataKeyNames value set on the control // The id parameter name should match the DataKeyNames value set on the control
public async Task catalogList_DeleteItem(int id) public async Task DeleteCatalogItemAsync(int id)
{ {
//TODO: Call the service. //TODO: Call the service.
} }

View File

@ -1,41 +1,61 @@
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="EditCatalogItem.aspx.cs" Inherits="eShopOnContainers.Catalog.WebForms.EditCatalogItem" Async="true" %> <%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="EditCatalogItem.aspx.cs" Inherits="eShopOnContainers.Catalog.WebForms.EditCatalogItem" Async="true" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server"> <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<asp:FormView ID="EditCatalogItemForm" runat="server" DefaultMode="Edit" <asp:FormView ID="EditCatalogItemForm" runat="server" DefaultMode="Edit"
ItemType="eShopOnContainers.Core.Models.Catalog.CatalogItem" ItemType="eShopOnContainers.Core.Models.Catalog.CatalogItem" DataKeyNames="Id"
SelectMethod="EditCatalogItemForm_GetItem" SelectMethod="GetCatalogItemAsync"
UpdateMethod="EditCatalogItemForm_UpdateItem" UpdateMethod="UpdateCatalogItemAsync"
InsertMethod="EditCatalogItemForm_InsertItem"> InsertMethod="InsertCatalogItemAsync"
CssClass="table-compact table-full-width">
<EditItemTemplate> <EditItemTemplate>
<section> <div class="row form-inline">
<div class="col-md-6"> <div class="col-md-6">
<form> <img class="esh-catalog-thumbnail" src="<%#:Item.PictureUri%>"
<div class="form-group"> style="border: solid" />
<label class="control-label form-label" for="ItemName">Name</label> </div>
<input name="ItemName" class="form-control form-input form-input-center" value="<%#Item.Name%>" /> <div class="col-md-6">
<div class="container">
<div class="row">
<div class="col-md-12 form-group">
<label>Name</label>
<asp:TextBox runat="server" ID="itemName" CssClass="form-control form-input form-input-center" Text='<%# Bind("Name")%>' />
</div> </div>
<div class="form-group"> </div>
<label class="control-label form-label" for="ItemDescription">Description</label> <div class="row">
<input name="ItemDescription" class="form-control form-input form-input-center" value="<%#Item.Description%>" /> <div class="col-md-12 form-group">
<label for="ItemDescription">Description</label>
<asp:TextBox runat="server" name="ItemDescription" Width="100%" ID="ItemDescription" CssClass="form-control form-input form-input-center" Text='<%# Bind("Description")%>' />
</div> </div>
<div class="form-group"> </div>
<label class="control-label form-label" for="ItemPrice">Price</label> <div class="row">
<input name="ItemPrice" class="form-control form-input form-input-center" value="<%#Item.Price%>" /> <div class="col-md-12 form-group">
<label for="ItemPrice">Price</label>
<asp:TextBox runat="server" TextMode="Number" Width="75%" name="ItemPrice" ID="ItemPrice" CssClass="form-control form-input form-input-center" Text='<%# Bind("Price")%>' />
</div> </div>
<div class="form-group"> </div>
<div class="row">
<div class="col-md-12 form-group">
<label class="control-label form-label" for="ItemBrand">Brand</label> <label class="control-label form-label" for="ItemBrand">Brand</label>
<asp:DropDownList ID="ItemBrand" runat="server" DataTextField="Brand" /> <asp:DropDownList ID="ItemBrand" runat="server" DataTextField="Brand" />
</div> </div>
<div class="form-group"> </div>
<div class="row">
<div class="col-md-12 form-group">
<label class="control-label form-label" for="ItemType">Type</label> <label class="control-label form-label" for="ItemType">Type</label>
<asp:DropDownList ID="ItemType" runat="server" DataTextField="Type" /> <asp:DropDownList ID="ItemType" runat="server" DataTextField="Type" />
</div> </div>
<div class="col-md-6"> </div>
This is where the picture to edit goes <div class="row">
<div class="col-md-6 form-group">
<asp:LinkButton runat="server" Text="Update" CommandName="Update" />
</div> </div>
</form> <div class="col-md-6 form-group">
<asp:LinkButton runat="server" Text="Cancel" CommandName="Cancel" />
</div>
</div>
</div> </div>
</section> </div>
</div>
</EditItemTemplate> </EditItemTemplate>
</asp:FormView> </asp:FormView>
</asp:Content> </asp:Content>

View File

@ -32,7 +32,7 @@ namespace eShopOnContainers.Catalog.WebForms
// The id parameter should match the DataKeyNames value set on the control // The id parameter should match the DataKeyNames value set on the control
// or be decorated with a value provider attribute, e.g. [QueryString]int id // or be decorated with a value provider attribute, e.g. [QueryString]int id
public async Task<CatalogItem> EditCatalogItemForm_GetItem([QueryString]int id) public async Task<CatalogItem> GetCatalogItemAsync([QueryString]int id)
{ {
// TODO: If null, go into insert mode. // TODO: If null, go into insert mode.
var itemToEdit = await catalog?.GetCatalogItemAsync(id.ToString()); var itemToEdit = await catalog?.GetCatalogItemAsync(id.ToString());
@ -40,7 +40,7 @@ namespace eShopOnContainers.Catalog.WebForms
} }
// The id parameter name should match the DataKeyNames value set on the control // The id parameter name should match the DataKeyNames value set on the control
public void EditCatalogItemForm_UpdateItem(int id) public void UpdateCatalogItemAsync(int id)
{ {
eShopOnContainers.Core.Models.Catalog.CatalogItem item = null; eShopOnContainers.Core.Models.Catalog.CatalogItem item = null;
// Load the item here, e.g. item = MyDataLayer.Find(id); // Load the item here, e.g. item = MyDataLayer.Find(id);
@ -58,7 +58,7 @@ namespace eShopOnContainers.Catalog.WebForms
} }
} }
public void EditCatalogItemForm_InsertItem() public void InsertCatalogItemAsync()
{ {
var item = new eShopOnContainers.Core.Models.Catalog.CatalogItem(); var item = new eShopOnContainers.Core.Models.Catalog.CatalogItem();
TryUpdateModel(item); TryUpdateModel(item);

View File

@ -72,7 +72,7 @@
<remove name="ApplicationInsightsWebTracking" /> <remove name="ApplicationInsightsWebTracking" />
<add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" /> <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" />
<!-- Use this if you are on IIS 8 and later --> <!-- Use this if you are on IIS 8 and later -->
<add name="InjectModule" type="eShopOnContainers.Catalog.WebForms.Modules.AutoFacHttpModule, eShopOnContainers.Catalog.WebForms"/> <add name="InjectModule" type="eShopOnContainers.Catalog.WebForms.Modules.AutoFacHttpModule, eShopOnContainers.Catalog.WebForms" />
</modules> </modules>
<validation validateIntegratedModeConfiguration="false" /> <validation validateIntegratedModeConfiguration="false" />
</system.webServer> </system.webServer>