CRUD form input width configuration

gustavnavar · Jul 13, 2020 · 80ecfdd · 80ecfdd
1 parent 881bef6
commit 80ecfdd
Show file tree

Hide file tree

Showing 20 changed files with 67 additions and 31 deletions.
diff --git a/GridBlazor/Columns/GridColumnBase.cs b/GridBlazor/Columns/GridColumnBase.cs
@@ -44,6 +44,8 @@ public abstract class GridColumnBase<T> : GridStyledColumn, IGridColumn<T>, IExp
 
         public string Width { get; set; }
 
+        public int CrudWidth { get; set; } = 5;
+
         public bool SortEnabled { get; protected set; }
 
         public string Title { get; set; }
@@ -119,6 +121,12 @@ IGridColumn<T> IColumn<T>.SetWidth(string width)
             return this;
         }
 
+        IGridColumn<T> IColumn<T>.SetCrudWidth(int width)
+        {
+            CrudWidth = width;
+            return this;
+        }
+
         IGridColumn<T> IColumn<T>.SetWidth(int width)
         {
             Width = width.ToString(CultureInfo.InvariantCulture) + "px";

diff --git a/GridBlazor/GridBlazor.csproj b/GridBlazor/GridBlazor.csproj
@@ -6,7 +6,7 @@
     <LangVersion>8.0</LangVersion>
     <GenerateEmbeddedFilesManifest>True</GenerateEmbeddedFilesManifest>
     <EnableDefaultEmbeddedResourceItems>False</EnableDefaultEmbeddedResourceItems>
-    <Version>1.7.0</Version>
+    <Version>1.7.1</Version>
     <Title>GridBlazor</Title>
     <Description>Grid components for Blazor</Description>
     <Summary>Grid components for Blazor</Summary>

diff --git a/GridBlazor/Pages/GridCreateComponent.razor b/GridBlazor/Pages/GridCreateComponent.razor
@@ -35,7 +35,7 @@
                     {
                         <label for="@column.FieldName" class="col-form-label col-md-2">@column.Title</label>
                     }
-                    <div class="@(type == typeof(bool)?"col-md-1":"col-md-5")">
+                    <div class="@(type == typeof(bool) ? "col-md-1" : "col-md-" + column.CrudWidth.ToString())">
                         @if (((IGridColumn<T>)column).IsSelectField.IsSelectKey)
                         {
                             var selectedValue = column.GetFormatedValue(value);

diff --git a/GridBlazor/Pages/GridDeleteComponent.razor b/GridBlazor/Pages/GridDeleteComponent.razor
@@ -32,7 +32,7 @@
                 {
                     <label for="@column.FieldName" class="col-form-label col-md-2">@column.Title</label>
                 }
-                <div class="@(type == typeof(bool)?"col-md-1":"col-md-5")">
+                <div class="@(type == typeof(bool) ? "col-md-1" : "col-md-" + column.CrudWidth.ToString())">
                     @if (((IGridColumn<T>)column).IsSelectField.IsSelectKey)
                     {
                         string text = ((IGridColumn<T>)column).GetFormatedValue(((IGridColumn<T>)column).IsSelectField.Expression, Item);

diff --git a/GridBlazor/Pages/GridReadComponent.razor b/GridBlazor/Pages/GridReadComponent.razor
@@ -31,7 +31,7 @@
                 {
                     <label for="@column.FieldName" class="col-form-label col-md-2">@column.Title</label>
                 }
-                <div class="@(type == typeof(bool)?"col-md-1":"col-md-5")">
+                <div class="@(type == typeof(bool) ? "col-md-1" : "col-md-" + column.CrudWidth.ToString())">
                     @if (((IGridColumn<T>)column).IsSelectField.IsSelectKey)
                     {
                         string text = ((IGridColumn<T>)column).GetFormatedValue(((IGridColumn<T>)column).IsSelectField.Expression, Item);

diff --git a/GridBlazor/Pages/GridUpdateComponent.razor b/GridBlazor/Pages/GridUpdateComponent.razor
@@ -35,7 +35,7 @@
                     {
                         <label for="@column.FieldName" class="col-form-label col-md-2">@column.Title</label>
                     }
-                    <div class="@(type == typeof(bool) ? "col-md-1" : "col-md-5")">
+                    <div class="@(type == typeof(bool) ? "col-md-1" : "col-md-" + column.CrudWidth.ToString())">
                         @if (column.IsPrimaryKey)
                         {
                             <input id="@column.FieldName" name="@column.FieldName" class="form-control" readonly="readonly" value="@column.GetFormatedValue(value)" />

diff --git a/GridBlazorClientSide.Client/ColumnCollections/ColumnCollections.cs b/GridBlazorClientSide.Client/ColumnCollections/ColumnCollections.cs
@@ -216,7 +216,8 @@ public static Action<IGridColumnCollection<Order>, IList<Func<object, Task>>, ob
             .SetInputType(InputType.Week)
             .SetFilterWidgetType("Week")
             .RenderValueAs(o => DateTimeUtils.GetWeekDateTimeString(o.OrderDate))
-            .SetWidth(120);
+            .SetWidth(120)
+            .SetCrudWidth(3);
 
             /* Adding "CompanyName" column: */
             c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName)
@@ -235,10 +236,10 @@ public static Action<IGridColumnCollection<Order>, IList<Func<object, Task>>, ob
             .RenderValueAs(o => o.Customer.IsVip ? Strings.BoolTrueLabel : Strings.BoolFalseLabel).SetCrudHidden(true);
 
             /* Adding hidden "RequiredDate" column: */
-            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
+            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
 
             /* Adding hidden "ShippedDate" column: */
-            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
 
             /* Adding hidden "ShipName" column: */
             c.Add(o => o.ShipName, true);

diff --git a/GridBlazorClientSide.Client/GridBlazorClientSide.Client.csproj b/GridBlazorClientSide.Client/GridBlazorClientSide.Client.csproj
@@ -3,7 +3,7 @@
   <PropertyGroup>
     <TargetFramework>netstandard2.1</TargetFramework>
     <RazorLangVersion>3.0</RazorLangVersion>
-    <Version>1.7.0</Version>
+    <Version>1.7.1</Version>
   </PropertyGroup>
 
   <ItemGroup>

diff --git a/GridBlazorOData.Client/GridBlazorOData.Client.csproj b/GridBlazorOData.Client/GridBlazorOData.Client.csproj
@@ -3,7 +3,7 @@
   <PropertyGroup>
     <TargetFramework>netstandard2.1</TargetFramework>
     <RazorLangVersion>3.0</RazorLangVersion>
-    <Version>1.7.0</Version>
+    <Version>1.7.1</Version>
   </PropertyGroup>
 
   <ItemGroup>

diff --git a/GridBlazorOData.Client/Pages/Crud.razor b/GridBlazorOData.Client/Pages/Crud.razor
@@ -60,13 +60,13 @@ else
             c.Add(o => o.CustomerID, true).SetSelectField(true, o => o.Customer.CustomerID + " - " + o.Customer.CompanyName, () => GetAllCustomers(baseUri));
             c.Add(o => o.EmployeeID, true).SetSelectField(true, o => o.Employee.EmployeeID.ToString() + " - " + o.Employee.FirstName + " " + o.Employee.LastName, () => GetAllEmployees(baseUri));
             c.Add(o => o.ShipVia, true).SetSelectField(true, o => o.Shipper == null ? "" : o.Shipper.ShipperID.ToString() + " - " + o.Shipper.CompanyName, () => GetAllShippers(baseUri));
-            c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).SetInputType(InputType.Week).SetFilterWidgetType("Week").RenderValueAs(o => DateTimeUtils.GetWeekDateTimeString(o.OrderDate)).SetWidth(120);
+            c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).SetInputType(InputType.Week).SetFilterWidgetType("Week").RenderValueAs(o => DateTimeUtils.GetWeekDateTimeString(o.OrderDate)).SetWidth(120).SetCrudWidth(3);
             c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName).SetWidth(250).SetCrudHidden(true).SetReadOnlyOnUpdate(true);
             c.Add(o => o.Customer.ContactName).Titled(SharedResource.ContactName).SetWidth(250).SetCrudHidden(true);
             c.Add(o => o.Freight).Titled(SharedResource.Freight).Format("{0:F}");
             c.Add(o => o.Customer.IsVip).Titled(SharedResource.IsVip).SetWidth(70).Css("hidden-xs").RenderValueAs(o => o.Customer.IsVip ? Strings.BoolTrueLabel : Strings.BoolFalseLabel).SetCrudHidden(true);
-            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
-            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
+            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
             c.Add(o => o.ShipName, true);
             c.Add(o => o.ShipAddress, true);
             c.Add(o => o.ShipCity, true);

diff --git a/GridBlazorServerSide/ColumnCollections/ColumnCollections.cs b/GridBlazorServerSide/ColumnCollections/ColumnCollections.cs
@@ -218,7 +218,8 @@ public static Action<IGridColumnCollection<Order>, IList<Func<object, Task>>, ob
             .SetInputType(InputType.Week)
             .SetFilterWidgetType("Week")
             .RenderValueAs(o => DateTimeUtils.GetWeekDateTimeString(o.OrderDate))
-            .SetWidth(120);
+            .SetWidth(120)
+            .SetCrudWidth(3);
 
             /* Adding "CompanyName" column: */
             c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName)
@@ -237,10 +238,10 @@ public static Action<IGridColumnCollection<Order>, IList<Func<object, Task>>, ob
             .RenderValueAs(o => o.Customer.IsVip ? Strings.BoolTrueLabel : Strings.BoolFalseLabel).SetCrudHidden(true);
 
             /* Adding hidden "RequiredDate" column: */
-            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
+            c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
 
             /* Adding hidden "ShippedDate" column: */
-            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+            c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
 
             /* Adding hidden "ShipName" column: */
             c.Add(o => o.ShipName, true);

diff --git a/GridBlazorServerSide/GridBlazorServerSide.csproj b/GridBlazorServerSide/GridBlazorServerSide.csproj
@@ -2,7 +2,7 @@
 
   <PropertyGroup>
     <TargetFramework>netcoreapp3.1</TargetFramework>
-    <Version>1.7.0</Version>
+    <Version>1.7.1</Version>
   </PropertyGroup>
 
   <ItemGroup>

diff --git a/GridMvc/Columns/GridColumnBase.cs b/GridMvc/Columns/GridColumnBase.cs
@@ -40,6 +40,8 @@ public abstract class GridColumnBase<T> : GridStyledColumn, IGridColumn<T>, ISGr
 
         public string Width { get; set; }
 
+        public int CrudWidth { get; set; } = 5;
+
         public bool SortEnabled { get; protected set; }
 
         public string Title { get; set; }
@@ -125,6 +127,12 @@ IGridColumn<T> IColumn<T>.SetWidth(int width)
             return this;
         }
 
+        IGridColumn<T> IColumn<T>.SetCrudWidth(int width)
+        {
+            CrudWidth = width;
+            return this;
+        }
+
         public IGridColumn<T> Css(string cssClasses)
         {
             AddCssClass(cssClasses);

diff --git a/GridMvc/GridMvc.csproj b/GridMvc/GridMvc.csproj
@@ -8,7 +8,7 @@
     <EnableDefaultEmbeddedResourceItems>False</EnableDefaultEmbeddedResourceItems>
     <Product>GridMvc</Product>
     <PackageId>GridMvcCore</PackageId>
-    <Version>3.0.0</Version>
+    <Version>3.0.1</Version>
     <Title>GridMvc</Title>
     <Description>ASP.NET MVC Grid component</Description>
     <Summary>ASP.NET MVC Grid component</Summary>

diff --git a/GridShared/Columns/IGridColumn.cs b/GridShared/Columns/IGridColumn.cs
@@ -84,6 +84,11 @@ public interface IColumn<T>
         /// </summary>
         IGridColumn<T> SetWidth(int width);
 
+        /// <summary>
+        ///     Sets the width of the column on crud forms
+        /// </summary>
+        IGridColumn<T> SetCrudWidth(int width);
+
         /// <summary>
         ///     Specify additional css class of the column
         /// </summary>
@@ -391,6 +396,11 @@ public interface IColumn
         /// </summary>
         string Width { get; set; }
 
+        /// <summary>
+        ///     Width of the column on crud forms
+        /// </summary>
+        int CrudWidth { get; set; }
+
         /// <summary>
         ///     EncodeEnabled
         /// </summary>

diff --git a/GridShared/GridShared.csproj b/GridShared/GridShared.csproj
@@ -3,7 +3,7 @@
   <PropertyGroup>
     <TargetFramework>netstandard2.1</TargetFramework>
     <LangVersion>8.0</LangVersion>
-    <Version>3.0.0</Version>
+    <Version>3.0.1</Version>
     <Title>GridShared</Title>
     <Description>Support library for GridBlazor and GridMvcCore component libraries</Description>
     <Summary>Support library for GridBlazor and GridMvcCore component libraries</Summary>

diff --git a/docs/blazor_client/Crud.md b/docs/blazor_client/Crud.md
@@ -266,6 +266,8 @@ inputType | ```InputType``` enum. Its value can be ```InputType.TextArea```, ```
 
 You can also add components on the CRUD forms using the ```RenderCrudComponentAs<TComponent>``` method. You must define these columns as **Hidden** to show them just on CRUD forms.
 
+You can configure the width of the column input element using the ```SetCrudWidth(int width)``` method. The default value is 5 and you can configure it from 1 to 10.
+
 And finally all columns included in the grid but not in the CRUD forms should be configured as "CRUD hidden" using the ```SetCrudHidden(true)``` method.
 
 **Notes**: 
@@ -284,13 +286,13 @@ This is an example of column definition:
             + o.Employee.FirstName + " " + o.Employee.LastName, path + $"api/SampleData/GetAllEmployees");
         c.Add(o => o.ShipVia, true).SetSelectField(true, o => o.Shipper == null ? "" : o.Shipper.ShipperID.ToString() 
             + " - " + o.Shipper.CompanyName, path + $"api/SampleData/GetAllShippers");
-        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName).SetReadOnlyOnUpdate(true);
         c.Add(o => o.Customer.ContactName).Titled(SharedResource.ContactName).SetCrudHidden(true);
         c.Add(o => o.Freight).Titled(SharedResource.Freight).Format("{0:F}");
         c.Add(o => o.Customer.IsVip).Titled(SharedResource.IsVip).RenderValueAs(o => o.Customer.IsVip ? "Yes" : "No").SetCrudHidden(true);
-        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
-        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
+        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.ShipName, true);
         c.Add(o => o.ShipAddress, true);
         c.Add(o => o.ShipCity, true);

diff --git a/docs/blazor_odata/Crud.md b/docs/blazor_odata/Crud.md
@@ -202,6 +202,8 @@ inputType | ```InputType``` enum. Its value can be ```InputType.TextArea```, ```
 
 You can also add components on the CRUD forms using the ```RenderCrudComponentAs<TComponent>``` method. You must define these columns as **Hidden** to show them just on CRUD forms.
 
+You can configure the width of the column input element using the ```SetCrudWidth(int width)``` method. The default value is 5 and you can configure it from 1 to 10.
+
 And finally all columns included in the grid but not in the CRUD forms should be configured as "CRUD hidden" using the ```SetCrudHidden(true)``` method.
 
 **Notes**: 
@@ -220,14 +222,14 @@ This is an example of column definition:
             + " " + o.Employee.LastName, () => GetAllEmployees(baseUri));
         c.Add(o => o.ShipVia, true).SetSelectField(true, o => o.Shipper == null ? "" : o.Shipper.ShipperID.ToString() + " - " 
             + o.Shipper.CompanyName, () => GetAllShippers(baseUri));
-        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}").SetWidth(120);
+        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}").SetWidth(120).SetCrudWidth(3);
         c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName).SetWidth(250).SetCrudHidden(true).SetReadOnlyOnUpdate(true);
         c.Add(o => o.Customer.ContactName).Titled(SharedResource.ContactName).SetWidth(250).SetCrudHidden(true);
         c.Add(o => o.Freight).Titled(SharedResource.Freight).Format("{0:F}");
         c.Add(o => o.Customer.IsVip).Titled(SharedResource.IsVip).SetWidth(70).Css("hidden-xs")
             .RenderValueAs(o => o.Customer.IsVip ? Strings.BoolTrueLabel : Strings.BoolFalseLabel).SetCrudHidden(true);
-        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
-        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
+        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.ShipName, true);
         c.Add(o => o.ShipAddress, true);
         c.Add(o => o.ShipCity, true);

diff --git a/docs/blazor_server/Crud.md b/docs/blazor_server/Crud.md
@@ -160,6 +160,8 @@ inputType | ```InputType``` enum. Its value can be ```InputType.TextArea```, ```
 
 You can also add components on the CRUD forms using the ```RenderCrudComponentAs<TComponent>``` method. You must define these columns as **Hidden** to show them just on CRUD forms.
 
+You can configure the width of the column input element using the ```SetCrudWidth(int width)``` method. The default value is 5 and you can configure it from 1 to 10.
+
 And finally all columns included in the grid but not in the CRUD forms should be configured as "CRUD hidden" using the ```SetCrudHidden(true)``` method.
 
 **Notes**: 
@@ -178,13 +180,13 @@ This is an example of column definition:
             + " - " + o.Employee.FirstName + " " + o.Employee.LastName, employeeService.GetAllEmployees);
         c.Add(o => o.ShipVia, true).SetSelectField(true, o => o.Shipper == null ? "" : o.Shipper.ShipperID.ToString() 
             + " - " + o.Shipper.CompanyName, shipperService.GetAllShippers);
-        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName).SetReadOnlyOnUpdate(true);
         c.Add(o => o.Customer.ContactName).Titled(SharedResource.ContactName).SetCrudHidden(true);
         c.Add(o => o.Freight).Titled(SharedResource.Freight).Format("{0:F}");
         c.Add(o => o.Customer.IsVip).Titled(SharedResource.IsVip).RenderValueAs(o => o.Customer.IsVip ? "Yes" : "No").SetCrudHidden(true);
-        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
-        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
+        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.ShipName, true);
         c.Add(o => o.ShipAddress, true);
         c.Add(o => o.ShipCity, true);

diff --git a/docs/dotnetcore_blazor/Crud.md b/docs/dotnetcore_blazor/Crud.md
@@ -158,6 +158,8 @@ inputType | ```InputType``` enum. Its value can be ```InputType.TextArea```, ```
 
 You can also add components on the CRUD forms using the ```RenderCrudComponentAs<TComponent>``` method. You must define these columns as **Hidden** to show them just on CRUD forms.
 
+You can configure the width of the column input element using the ```SetCrudWidth(int width)``` method. The default value is 5 and you can configure it from 1 to 10.
+
 And finally all columns included in the grid but not in the CRUD forms should be configured as "CRUD hidden" using the ```SetCrudHidden(true)``` method.
 
 **Notes**: 
@@ -176,13 +178,13 @@ This is an example of column definition:
             + " - " + o.Employee.FirstName + " " + o.Employee.LastName, employeeService.GetAllEmployees);
         c.Add(o => o.ShipVia, true).SetSelectField(true, o => o.Shipper == null ? "" : o.Shipper.ShipperID.ToString() 
             + " - " + o.Shipper.CompanyName, shipperService.GetAllShippers);
-        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.OrderDate, "OrderCustomDate").Titled(SharedResource.OrderCustomDate).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.Customer.CompanyName).Titled(SharedResource.CompanyName).SetReadOnlyOnUpdate(true);
         c.Add(o => o.Customer.ContactName).Titled(SharedResource.ContactName).SetCrudHidden(true);
         c.Add(o => o.Freight).Titled(SharedResource.Freight).Format("{0:F}");
         c.Add(o => o.Customer.IsVip).Titled(SharedResource.IsVip).RenderValueAs(o => o.Customer.IsVip ? "Yes" : "No").SetCrudHidden(true);
-        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}");
-        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}");
+        c.Add(o => o.RequiredDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
+        c.Add(o => o.ShippedDate, true).Format("{0:yyyy-MM-dd}").SetCrudWidth(3);
         c.Add(o => o.ShipName, true);
         c.Add(o => o.ShipAddress, true);
         c.Add(o => o.ShipCity, true);