How to Enable Editing in the Content Intelligence Panel

The AppBus integration enables you to configure the Content Intelligence panel to support editing the information.

About

To enable editing, create a custom Content intelligence display template and customize it to support editing. By default, the Content Intelligence template is stored at \modules\ContentIntelligence\templates\modalTemplate.html.

Note: The Content Intelligence template is overwritten when SmartHub is upgraded.

See here to learn how to create your own Content Intelligence template.

How to Modify the Content Intelligence Template

In your own Content Intelligence template you have access to the functionality described in the sub-topics below. You can use the code blocks to enable editing in each section.

How to Enable Editing in Spans

  1. Make a span editable or not by adding the attribute data-edit="true" to the element:

Editable field

Copy 
<div class="sh-form-group">    
    <label class="sh-form-control-label">Collection</label>    
    <span class="sh-form-control" data-edit="true"><%= result.CollectionName %></span>
</div>

Requirements

Note that an editable span that is not mapped to any parameter (see point 2 below) is ignored.

How to Map Spans to Parameters

  1. Map a span to a parameter that needs to be passed to the AppBus flow by adding the attribute data-integration-mapTo="<name of parameter>":

    Read-only mapped field
    Copy 
    <div class="sh-form-group">    
        <label class="sh-form-control-label">Collection</label>    
        <span class="sh-form-control" data-integration-mapTo="parameter1"><%= result.CollectionName %></span>
    </div>

    Editable mapped field
    Copy 
    <div class="sh-form-group">    
        <label class="sh-form-control-label">Collection</label>    
        <span class="sh-form-control" data-edit="true" data-integration-mapTo="parameter1"><%= result.CollectionName %></span>
    </div>

    Requirements

    Please note that while the spans that are mapped as parameters can be editable, it is not a hard requirement.

    If a field is mapped, but not editable, the current value (inner HTML) is passed over as a parameter as-is.

How to Create a Trigger Button to Run AppBus Flow

  1. Create a trigger button that reads all parameters and runs the AppBus flow by specifying data-integration-url="<relative URL to the flow>":

    Trigger button
    Copy 
    <div class="sh-modal-footer">    
        <button class="sh-button" data-integration-url="api/contoso/documents/update">Save changes</button>
    </div>