Change Other column display based on selected combobox column in Normal Mode.
Hello Team
Is this possible?
"Change Other column display based on selected combobox column in Normal Mode."
GridDetail.UpdateCell seems only work in batch mode and I'm using OnActionBegin event on my CRUD operation which does not work in batchmode.
I need to retrieve Itemcode and unit cost based on selected product item.. Hoping, There must be couterpart of GridDetail.UpdateCell in Normal Mode.
If none, Could you give me a sample CRUD in batchmode.
@************Item*@
<GridForeignColumn Field=@nameof(SODetailEdit.ItemID)
EditType="EditType.DropDownEdit"
HeaderText="Item"
ForeignKeyValue="ItemDescription"
ForeignDataSource="@Items"
Width="140">
<EditTemplate>
<SfComboBox @ref="ComboBoxItem" TItem="Item" TValue="int" AllowCustom="false" Autofill="true" Placeholder=" Select Product" CssClass="e-multi-column" AllowFiltering="true" DataSource="@Items" PopupHeight="300px" Width="2000" @bind-Value="SODetailEdit.ItemID">
<ComboBoxTemplates TItem="Item">
<HeaderTemplate>
<table><tr><th class="e-text-center combo-width">ItemID</th><th>ItemCode</th><th>Desctiption</th><th>Price</th></tr></table>
</HeaderTemplate>
<ItemTemplate Context="ComboContext">
<table><tbody><tr><td class="e-text-center combo-width">@((ComboContext as Item).ItemID)</td><td>@((ComboContext as Item).ItemCode)</td><td>@((ComboContext as Item).ItemDescription)</td><td>@((ComboContext as Item).Price)</td></tr> </tbody></table>
</ItemTemplate>
</ComboBoxTemplates>
<ComboBoxFieldSettings Value="ItemID" Text="ItemDescription"></ComboBoxFieldSettings>
<ComboBoxEvents TItem="Item" TValue="int" ValueChange="ValueChangeItem"></ComboBoxEvents>
</SfComboBox>
</EditTemplate>
<GridColumn Field=@nameof(SODetailEdit.ItemCode) HeaderText="Item Code"
EditType="EditType.DefaultEdit"
Width="140">
</GridColumn>
<GridColumn Field=@nameof(SODetailEdit.UnitCost) HeaderText="Price"
EditType="EditType.DefaultEdit"
Width="140">
</GridColumn>
*********Code block for update cell
public async void ValueChangeItem(@Syncfusion.Blazor.DropDowns.ChangeEventArgs<int, Item> args)
{
//Item = (await ItemService.GetItem()).Where(e => e.ProvinceID == args.ItemData.ProvinceID).OrderBy(e => e.MunicipalityName).ToList();
Item = await ItemService.GetItem(args.ItemData.ItemID); // service request
StateHasChanged();
if (Item != null)
{
await GridDetail.UpdateCell(RowIndexDetail, "ItemCode", Item.ItemCode);
await GridDetail.UpdateCell(RowIndexDetail, "UnitCost", Item.UnitCost);
}
}
|
@using Syncfusion.Blazor.Grids
@using Syncfusion.Blazor.DropDowns
@using Syncfusion.Blazor.Inputs
<SfGrid @ref="Grid" DataSource="@Orders" Height="315" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })">
<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings>
<GridColumns>
<GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="TextAlign.Right" Width="120"></GridColumn>
<GridForeignColumn Field=@nameof(Order.EmployeeID) HeaderText="Employee Name" ForeignKeyValue="FirstName" ForeignDataSource="@Employees" Width="150">
<EditTemplate>
@{
var order = (context as Order);
}
<SfComboBox ID="EmployeeID" TItem="EmployeeData" TValue="int?" @bind-Value="@((context as Order).EmployeeID)" DataSource="@Employees">
<ComboBoxFieldSettings Text="FirstName" Value="EmployeeID"></ComboBoxFieldSettings>
<ComboBoxEvents TItem="EmployeeData" TValue="int?" ValueChange="@OnChange"></ComboBoxEvents>
</SfComboBox>
</EditTemplate>
</GridForeignColumn>
<GridColumn Field=@nameof(Order.ItemCode) HeaderText="Item Code" TextAlign="TextAlign.Right" Width="120">
<EditTemplate>
<SfNumericTextBox ID="ItemCode" @ref="NumericRef" TValue="int?" @bind-Value="@((context as Order).ItemCode)"></SfNumericTextBox>
</EditTemplate>
</GridColumn>
. ..
</GridColumns>
</SfGrid>
@code{
SfGrid<Order> Grid;
SfNumericTextBox<int?> NumericRef;
. ..
public async Task OnChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs<int?, EmployeeData> args)
{
NumericRef.Value = args.Value;
}
} |
Hi Rahul,
Thanks for the Immediate reply,
Is there is a way to view the textbox changes upon Value Change of EmployeeID (Combo). instead showing it upon textbox focus?
|
<GridColumn Field=@nameof(Order.ItemCode) HeaderText="Item Code" TextAlign="TextAlign.Right" Width="120">
<EditTemplate>
<SfNumericTextBox ID="ItemCode" TValue="int?" Value="@ItemCodeValue"></SfNumericTextBox>
</EditTemplate>
</GridColumn>
@code{
public int? ItemCodeValue { get; set; }
public void OnActionComplete(ActionEventArgs<Order> args)
{
if (args.RequestType.Equals(Action.BeginEdit) || args.RequestType.Equals(Action.Add))
{
args.PreventRender = false;
}
}
public void OnActionBegin(ActionEventArgs<Order> args)
{
if (args.RequestType.Equals(Action.BeginEdit) && args.RequestType.Equals(Action.Add))
{
ItemCodeValue = args.Data.ItemCode;
}
if (args.RequestType.Equals(Action.Save))
{
args.Data.ItemCode = ItemCodeValue;
}
}
...
public async Task OnChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs<int?, EmployeeData> args)
{
ItemCodeValue = args.Value;
}
}
|
Thanks Renjith.
I will try to use your solution for computations such as TotalCost = Quantity * UnitCost;
btw, I also tried focusIn method and it also works.
