data.addNew() is missing grouped columns

data.addNew() is missing grouped columns

Posted by: moritz.neugebauer on 5 June 2020, 2:23 pm EST

• 

  moritz.neugebauer

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 5 June 2020, 2:23 pm EST - Updated 3 October 2022, 4:12 pm EST

  Dear Wijmo Team,

  Using Angular 8, I’m rendering my grid with a mix of normal and grouped columns.

  This is how I create the grouped columns

  
  return {
              dataType: Datatype[attribute.datentyp],
              header: this.getAttributHeader(attribute, columnLevel),
              columns: this.calculateSubColumns(attribute),
              binding: 'attributeValue.' + attribute.id + '.content',
              visible: visible,
              format: format,
              isReadOnly: attribute.isReadOnly,
              isRequired: false,
            }
  
  

  Displaying and editing the grouped columns works just fine. However, when programmatically creating a new row by using “this.data.addNew()”, the objects for the grouped columns are missing in

  
  this.flexdata.selectedItems[0].attributeValue[attribute.id]
  
  

  Therefore, when trying to set

  
  this.flexdata.selectedItems[0].attributeValue[attribute.id].content = value
  
  

  I get an TypeScript error.

  In the following example, when printing out row 1 or 2 in the console, there are six attributes. But when printing out the newly created row, there are only 4 attributes. The ones for “Quellattribut 1” and “Quellattribut 2” are missing.
  
  

  

  1902×252 31.6 KB

  Is there anything specific about data.addNew() that might cause this issue?

  Best regards
  
  Moritz

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 8 June 2020, 1:09 am EST

  Hi Moritz,

  If you are using complex binding, like in you example, the addNew method does not know about it because the binding is used in flexgrid and not in collectionview.

  Now, to use the complex binding with the newly created data, you will need to handle the newItemCreator property of the CollectionView. This is used to define the blueprint of the new item. In your case, it would be something like:

  collectionview.newItemCreator = () => {
  	var item = {};
  	item['attributeValue.' + attribute.id + '.content'] = null;
  	// if you have more than 1 attribute.id, then add all of them
  	// here and initialize it
  	// for eg, if ids are 'Quellattribut 1', 'Quellattribut 2', etc
  	// item['attributeValue' + 'Quellattribut 1' + 'content'] = null;
  	// item['attributeValue' + 'Quellattribut 2' + 'content'] = null;
  	return item;
  }```
  
  Note that this property is only defined once, so all the complex binding should be added to the newly created item.
  API: https://www.grapecity.com/wijmo/api/classes/wijmo.collectionview.html#newitemcreator
  
  Regards,
  Ashwin

• 

  moritz.neugebauer

  • Post Options:
  • Link
    Copy

  Posted 8 June 2020, 1:46 am EST

  Hi Ashwin,

  thank you very much for you response and for hinting me towards the newItemCreator property. It’s working for me now!

  Best regards
  
  Moritz