Flexgrid group footer

Flexgrid group footer

Posted by: alicja-maziarz1 on 14 September 2017, 12:06 pm EST

• 

  alicja-maziarz1

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 September 2017, 12:06 pm EST

  Hi,
  
  I am trying to insert footer for each group in the angularJS flexgrid and looking for the best solution and some advice on how to achieve that. So far I have tried to use the following:

  1. ColumnFooter - I had set cell template for column footer to no avail. Then I tried to add rows to ColumnFooter panel in controller in the grid initialize event flex.columnFooters.rows.push(row) but for some reason columnFooter is always undefined in my grid.
  2. I have came across sample directive for group subtotals on the forum. I was able to insert footer row using this approach. I would like to further customize that row beyond showing data or text content. How could I set some cells to show HTML content? For example icon, button etc. Get rid of some content in the column (columns are in repeater and applied cell templates) that shouldn’t be in the footer row? See picture attached.
     
     
• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 12:06 pm EST

  Hello,
  
  Please refer to the attached sample for adding columnFooter in FlexGrid. Please make sure that you are using build 5.20162.207 or earlier.

  For adding a footer for each group, please refer to the following sample:
  
  http://demos.wijmo.com/5/Angular/CustomFooters/CustomFooters/

  You can use HTML content in setCellData with setting isContentHTML to true for that row. This will allow you to set HTML content in cell.

  Thanks,
  
  Manish Kumar Gupta
  
  2017/06/FlexGrid_columnFooter.zip

• 

  alicja-maziarz1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 12:06 pm EST

  Hi Manish,
  
  thank you for the response. I have tried your suggestion and added the following code to the directive to insert button in 4th column cell. The text content in second cell is generated but no button in column 4. Is that what you suggested?
  
  The code doesn’t generate button:
  
  var newRow = new wijmo.grid.Row();
  
  newRow.level = row.level + 1;
  
  newRow.group = row.dataItem;
  
  newRow.isContentHtml = true;
  
  flex.rows.insert(index, newRow);
  
  flex.setCellData(index, 2, 'Footer for group: ’ + group.name, false);
  
  var html = ‘<button type=“button” id=“elem”>Button 1</button>’;
  
  flex.setCellData(index, 4, html, false);

  Thank you,

• 

  alicja-maziarz1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 12:06 pm EST

  Hi Manish,
  
  the code from previous post works as expected. Sorry for confusion, and thank you.