No announcement yet.
  • Filter
  • Time
Clear All
new posts

    How to Make Parent Grid and Expanded Grid Column same

    Is there any way we can make the Child(Expand) Grid Design Perfectly match with the Parent Grid Column alignment ?

    See the attached image
    Attached Files

    It's not clear if you're using one of the built-in expansion modes or not, but if it's one of the built-in modes, look at the docs for the AutoChild used by that mode and you can configure styling and/or properties for the created component to get rid of indent.

    However, if the data columns are exactly the same in your expansion, then you probably don't want to use expandable records, because you have basically ended up reinventing the TreeGrid, except extremely inefficiently, because every time you open what should have been just a folder, you're creating a nested grid component and fetching separate data.


      Both Grid has same Columns, We didnt used Built-in Modes. We have Used a Custom Grid Component which is same as parent.
      Parent Grid will show Cumulative SUM
      Child(Expand Grid) Show Separate value for the SUM of Parent

      Please see the code :

      ID : "parent",
      width : "100%",
      height : "80%",
      headerHeight : 56,
      border : "0px",
      alternateRecordStyles : true,
      leaveScrollbarGap : false,
      showHeaderContextMenu : false,
      showHeaderMenuButton : false,
      canSort : false,
      canReorderFields : false,
      autoFitWidthApproach : "both",
      canExpandRecords : true,
      getExpansionComponent : function(record) {

      var child = isc.ListGrid.create({ ID: "child ",
      width : "100%", autoFitData : "both",
      showHeader : false,
      showHeaderContextMenu : false,
      showHeaderMenuButton : false,
      canSort : false,
      canReorderFields : false,
      fields : detailFields,
      data: record.innerGrid
      var layout = isc.VLayout.create({
      align : "left",
      padding : 0,
      membersMargin : 0,
      left : 0,
      members : [child ]
      return layout;
      Last edited by sathis201021; 18th Feb 2021, 22:52.


        We've just exposed two internal properties, ListGrid.embeddedComponentMargin, which applies margin on all sides of the child-component, and ListGrid.expansionIndent (which affects the left offset of the inner-grid, or the right-offset in RTL mode) and defaults to the width of the expansionField).

        You didn't mention your version (we always need that information), but you can use those new attributes in builds of 12.1 or 13.0, dated February 22 or later.

        If you set both of these to zero and you still don't have what you need, we'll need to see code we can run to see the problem - your image is a little confused and your sample code has no fields, DataSources or data, for example.