Custom Lightning Web Components in Gift Entry Grid in Education

Properties Sent to a Component from the Gift Entry Grid

The Gift Entry Grid passes row data to custom Lightning web components through the params property for cell components and the rowData property for modals.

Sending Data Back to Gift Entry Grid

Column Modals

Column modals and cell edit components use different mechanisms to return data to the Gift Entry Grid.

Column Modals are rendered within a wrapper lightning web component that includes the modal title (as defined in the template) as well as a Continue and a Cancel button.

The Continue button is what the user will click to close your custom modal. It will call these required exposed functions:

Cell Edit Component

To return data back to the Gift Entry Grid from a cell edit component:

• Construct an object as the message to return to the Gift Entry Grid.
• Publish an event to the lightning__giftEntryGridComponentAction message channel.

The contents of the message body are strict. Follow the structure of this example:

// Build the "message" object to send back to 
// Gift Entry Grid following the documented contract
const message = {

    // Required properties (do not change the values below)
    action: "ColumnEdit",
    componentName: this.tagName,
    colId: this._params?.colDef?.colId,

    // 'details' is an optional property:
    // - include if there is data to write to the row 
    //   in Gift Entry
    details: {

        // rowId and rowIndex must be included in details
        rowId: this.params?.data?.id,           // Required
        rowIndex: this.params?.data?.rowIndex,  // Required

        // All GiftEntry fields to write to rowData
        // and as object in a key:value collection.
        // To clear the value of a field on the GiftEntry rowData
        // object, return null instead of undefined
        giftEntryFields : { key: value, ... },

        // rowProperties is optional, but if passed can be
        // referenced by other custom components. Data in this
        // object are not persisted to the GiftEntry record.
        rowProperties: { key : value, ... },

        // Special Use: If your custom column component is 
        // forcing a matched gift transaction, use these
        // properties to send the matching transaction ID 
        // and NAME back to grid for proper handling:
        matchingGiftTransactionId: {giftTransactionId},
        matchingGiftTransactionName: {giftTransactionName}
    }
}

Note No properties are returned to the grid from the Column Component (Display) or Cell Display Component.

Considerations for Returning Data

When returning data back to the Gift Entry Grid, consider these rules for picklist and lookup fields.

Picklist field considerations:

• If picklist fields are returned as a simple string, the value should represent the picklist API name in the event that the label and the API name are different.
• Picklist fields can also be returned as an object in the form of { value: xx, displayValue: zz }. Here's an example:

  { 
    giftType: 
      { value: “Organizational”, 
        displayValue: “Organizativo/Doméstico” 
      }
  }

Lookup field considerations:

• Lookup Fields that are not columns in the Gift Entry Grid can be returned as just an ID string only in a response object. For example, {MyLookupFieldId__c: ‘xxx00000000’}
• Lookup fields that are field columns in the Gift Entry Grid, such as Campaign and Outreach Source Code, should be returned from a custom Lightning web component in an object form to make sure that they render properly in the grid. Here’s an example:

  Campaign: {
     Id: {campaignId},
     Name: {campaignName}
  }