I have two grids. I want to show the foreign key field text & value of grid1's selected row in grid2's corresponding column upon adding a new element in grid2. I feel I have done the right code but still there is a problem.
When ActionBeginHandler of grid2 is called upon pressing 'Add', the DataSource for the corresponding foreign key field is changed through ActionBeginHandler. But right after this, the ActionBeginHandler is called automatically and the args.Request parameter contains "Refresh" which doesn't let the Add row appear. The Add row just blinks and goes away. Kindly tell me how to show the foreign key field value of grid1's selected row in grid2's corresponding column upon adding. This column is a dropdown list in grid2. Kidnly refer to the code below.
Please help. Thanks
Code:
<EjsGrid ModelType="@ProjectModel" TValue="Projekte" AllowPaging="true" AllowFiltering="true" AllowSorting="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })">
<GridEvents QueryCellInfo="QueryCellInfoHandler" RowSelected="RowSelectHandler" TValue="Projekte"></GridEvents>
<EjsDataManager Url="/Api/Default" Adaptor="Adaptors.WebApiAdaptor"></EjsDataManager>
<GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true" Mode="EditMode.Normal"></GridEditSettings>
<GridColumns>
<GridColumn Field=@nameof(Projekte.Id) Type="ColumnType.Number" DefaultValue=0 AllowEditing="false" IsIdentity="true" IsPrimaryKey="true" HeaderText="ID" Width="100" TextAlign="TextAlign.Center"></GridColumn>
<GridColumn Field=@nameof(Projekte.ProjectNo) AllowEditing="false" DefaultValue="0" HeaderText="ProjectNo" TextAlign="TextAlign.Center"></GridColumn>
</GridColumns>
</EjsGrid>
<EjsGrid ModelType="@OrderModel" TValue="Order" AllowFiltering="true" AllowSorting="true" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Query="@QueryData">
<GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true" Mode="EditMode.Normal"></GridEditSettings>
<GridEvents OnActionBegin="ActionBeginHandler" QueryCellInfo="QueryCellInfoHandler" TValue="Order"></GridEvents>
<EjsDataManager Url="/Api/Orders" Adaptor="Adaptors.WebApiAdaptor" CrossDomain="true"></EjsDataManager>
<GridColumns>
<GridColumn Field=@nameof(Order.OrderId) Type="ColumnType.Number" DefaultValue=0 AllowEditing="false" IsIdentity="true" IsPrimaryKey="true" HeaderText="ID" TextAlign="TextAlign.Center"></GridColumn>
<GridColumn Field=@nameof(Order.ProjectId) Type="ColumnType.Number" HeaderText="Projekte ID" AllowFiltering="false" EditType="EditType.DropDownEdit" TextAlign="TextAlign.Center"
DataSource="@projectsDataSource"
ForeignKeyField="Id" ForeignKeyValue="Name">
<FilterTemplate Context="ProjectId"></FilterTemplate>
</GridColumn>
</GridColumns>
</EjsGrid>
@code
{
public List<ProjectVM> projectsDataSource { set; get; }
public Projekte ProjectModel = new Projekte();
public Order OrderModel = new Order();
protected override async Task OnInitializedAsync()
{
projectsDataSource = new List<ProjectVM>();
projectsDataSource = await Http.GetJsonAsync<List<ProjectVM>>("/Api/Default/GetProjectsList");
}
private string selectedProjNum;
private string QueryData { get; set; }
public void RowSelectHandler(RowSelectEventArgs<Projekte> args) //takes project id and project No of the selected row in grid1
{
var id = args.Data.Id; // fetching clicked project's id and
QueryData = $"new ej.data.Query().addParams('$projId', {id})"; //setting this parameter as a part of Get orders query
selectedProjNum = args.Data.ProjectNo;
}
public void ActionBeginHandler(ActionEventArgs<Order> args)
{
// change datasource of grid2 upon value of Porject no selected in grid1
if ((args.RequestType.ToString() == "Add") && selectedProjNum != null && args.Type == "actionBegin")
{
projectsDataSource = projectsDataSource.Where(m => m.Name == selectedProjNum).ToList(); //select only one project number
}
}
}
