How to configure relationship sequence and drag-and-drop

Prev Next

You can configure the grid columns with product attributes or relationship attributes for Assets, Relationships, and Variants tabs. By default, you can view Type (entity type / asset type), ID, and Display Name in the Relationship grids.

Note: The relationship attributes are editable, and you can perform inline editing within the grid for assets, variants and relationships, if it is configured.

Sample JSON configuration for owned relationship

Sample JSON that defines the attribute columns for the Images relationship:

{
  "metaInfo": {
    "dataIndex": "config",
    "collectionName": "configObjects",
    "responseObjectName": "response"
  },
  "configObjects": [
    {
      "id": "rock-entity-relationship-search-result-v2_dragAndDrop_hasImages_commerceUXConfig",
      "name": "rock-entity-relationship-search-result-v2_dragAndDrop_hasImages",
      "type": "commerceUXConfig",
      "data": {
        "contexts": [
          {
            "context": {
              "component": "rock-entity-relationship-search-result-v2",
              "relationship": "hasImages",
              "role": "_DEFAULT"
            },
            "jsonData": {
              "config": {
                "governDataConfig": {
                  "visible": false
                },
                "gridConfig": {
                  "attributeForDragAndDrop": "order",
                  "itemConfig": {
                    "fields": {
                      "assetOrder": {
                        "name": "assetOrder",
                        "visible": true,
                        "displaySequence": 10,
                        "editType": "",
                        "sortable": true,
                        "isRelatedEntityAttribute": false
                      },
                      "viewMode": "Tabular"
                    }
                  }
                }
              }
            }
          }
        ]
      }
    }
  ]
}

Sample JSON configuration for whereused relationship

Sample JSON that defines the attribute columns for the Crosssell Reference relationship:

{
  "metaInfo": {
    "dataIndex": "config",
    "collectionName": "configObjects",
    "responseObjectName": "response"
  },
  "configObjects": [
    {
      "id": "rock-entity-relationship-search-result-v2_dragAndDrop_crosssellReference_commerceUXConfig",
      "name": "rock-entity-relationship-search-result-v2_dragAndDrop_crosssellReference",
      "type": "commerceUXConfig",
      "data": {
        "contexts": [
          {
            "context": {
              "component": "rock-entity-relationship-search-result-v2",
              "relationship": "crosssellReference",
              "role": "_DEFAULT"
            },
            "jsonData": {
              "config": {
                "governDataConfig": {
                  "visible": false
                },
                "upDirectionConfig": {
                  "gridConfig": {
                    "attributeForDragAndDrop": "order",
                    "itemConfig": {
                      "fields": {
                        "assetOrder": {
                          "name": "assetOrder",
                          "visible": true,
                          "displaySequence": 10,
                          "editType": "",
                          "sortable": true,
                          "isRelatedEntityAttribute": false
                        },
                        "viewMode": "Tabular"
                      }
                    }
                  }
                }
              }
            }
          }
        ]
      }
    }
  ]
}

To configure relationship sequence and Drag-and-drop for owned relationship grid:

  1. Download the attached JSON file.

rock-entity-relationship-search-result-v2_dragAndDrop_hasImages_commerceUXConfig
1.46 KB
  1. Open the rock-entity-relationship-search-result-v2_dragAndDrop_hasImages_commerceUXConfig.json file and specify the following:

Parameters

Details

context

component

Specify the name of the component to be configured.

relationship

Specify the relationship name for which the component is to be configured, else _ DEFAULT.

role

Specify the role for which the component is to be configured, else _DEFAULT.

Note: By default, _DEFAULT is specified for role, which implies the component is configured for all roles and users.

config > gridConfig

Specify the following details:

attributeForDragAndDrop

Specify the internal name of the attribute.

itemConfig > fields

Specify the details of a relationship attribute that displays the order of relationships.

Note: The "isRelatedEntityAttribute" flag must be set to false for a relationship attribute.

  1. Upload the JSON configuration file in the Classic UI. For more information, see How to upload UI Configurations.

    In the Assets tab, you can view the Drag-and-drop icon and the configured attribute column.

    ui-configurations-pdp-assets-reorder.png