We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Multiple querystring in hierarchy child grid in Angular Grid

Dear Team

I want multiple querystring in hirarchy child grid. So please provide as soon as possible. I am waiting for your positive response.

1 Reply 1 reply marked as answer

RS Rajapandiyan Settu Syncfusion Team May 5, 2021 12:23 PM UTC

Hi Nagendra, 

Thanks for contacting Syncfusion support. 
 
Query: I want multiple querystring in hirarchy child grid. 
 
By default, the child-Grid supports only one queryString and this is the behavior of EJ2 Grid. 
 
However, You can achieve your requirement by including additional parameters to the Child-Grid’s query in its load event. 
 
 
 
In that event, we send the multiple additional parameters in the child-Grid’s query. Please find the below code example for more information. 
 
 
 
[app.component.ts] 
 
export class AppComponent { 
  ---- 
  public childGrid: any; 
 
  ngOnInit(): void { 
    ---- 
    this.childGrid = { 
      dataSource: new DataManager({ 
        url: "/Home/UrlDatasourceChild", 
        adaptor: new UrlAdaptor() 
      }), 
      queryString: "EmployeeID", 
      ----- 
      load: this.load 
    }; 
  } 
 
  load = function(args) { 
    // get the parentRow data 
    var parentRowData = this.parentDetails.parentRowData; 
    console.log(parentRowData); 
    // add additional data to the childGrid’s query which will sent the server side for each childGrid’s action 
    this.query = new Query().addParams("OrderID", parentRowData["OrderID"]); 
    this.query.addParams("CustomerID", parentRowData["CustomerID"]); 
    this.query.addParams("ShipCountry", parentRowData["ShipCountry"]); 
    this.query.addParams("ShipCity", parentRowData["ShipCity"]); 
  }; 
 
 
[HomeControllers.cs] 
 
        public ActionResult UrlDatasourceChild(TestDm dm) // Use TestDm class to retrieve the additional params sent by the Grid 
        { 
 
// use Params data and do all the stuff you need and return data to Grid 
            IEnumerable<BigData> DataSource = BigData.GetAllRecords().ToList(); 
            DataOperations operation = new DataOperations(); 
 
            if (dm.Search != null && dm.Search.Count > 0) 
            { 
                DataSource = operation.PerformSearching(DataSource, dm.Search);  //Search 
            } 
            if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting 
            { 
                DataSource = operation.PerformSorting(DataSource, dm.Sorted); 
            } 
            if (dm.Where != null && dm.Where.Count > 0) //Filtering 
            { 
                DataSource = operation.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator); 
            } 
            int count = DataSource.Cast<BigData>().Count(); 
           if (dm.Skip != 0) 
            { 
                DataSource = operation.PerformSkip(DataSource, dm.Skip);   //Paging 
            } 
            if (dm.Take != 0) 
            { 
                DataSource = operation.PerformTake(DataSource, dm.Take); 
            } 
            return dm.RequiresCounts ? Json(new { result = DataSource, count = count }) : Json(DataSource); 
        } 
        public class TestDm : DataManagerRequest // define the params field 
        { 
            public ParamObject Params { get; set; } 
            public int OrderID { get; set; } 
            public string CustomerID { get; set; } 
            public string ShipCountry { get; set; } 
            public string ShipCity { get; set; } 
 
        } 
        public class ParamObject   // define the required field as you want 
        { 
            public int OrderID { get; set; } 
            public string CustomerID { get; set; } 
            public string ShipCountry { get; set; } 
            public string ShipCity { get; set; } 
       } 
 
 
Screenshot #1: Request to the server 
 
 
Screenshot #2: Get the request at server 
 
 
 
Please get back to us if you need further assistance with this. 
 
Regards, 
Rajapandiyan S 


Marked as answer
Loader.
Up arrow icon