function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Peter BölkePeter Bölke 

Aura Datatable highlight invalid values

Hi there,

how can i check for invalid length on a datatable with inline editing in an Aura Component? I need to prevent numbers with more than 5 digits and in case this check fails i like to highlight the cell where the error occurs.

regards
Peter
 
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Peter,

You can use "oncellchange"  in datatable and use it in js file to show the error.
  
<lightning:datatable data="{! v.data }" columns="{! v.columns }" keyField="Id" oncellchange="{! c.onCellChange }" aura:id="mydatatable"/>
  
({
    onCellChange: function(component, event, helper) {
        var editedCell = event.getParam('value');
        var colName = event.getParam('fieldName');
        var rowId = event.getParam('row').Id;
        
        // Check for length greater than 5
        if (editedCell && editedCell.length > 5) {
            // Set custom error message
            var errors = [{message: 'Invalid length: Maximum length is 5.'}];
      
            component.find("mydatatable").showCellError(rowId, colName, errors);
        } else {
            // Clear any previous errors
            component.find("myTable").clearCellErrors(rowId, colName);
            // Update the data with the edited value
            
        }
    }
})

Let me know if you face any issues.

If this solution helps, Please mark it as best answer.

Thanks,
Peter BölkePeter Bölke
Hi Praveen,

sadly the event return no table, instead it return the changed values as dict or map. Actually what most commonly stored in v.draftValues.
  
<aura:attribute name="recordId" type="String"/>
        <!-- attributes -->
        
         <!--<aura:attribute name="queryResult" type="SObject[]" /> -->
        <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
        <!--<aura:handler event="force:refreshView" action="{!c.doInit}"/> -->
        <aura:attribute name="data" type="Account_RB__c"/>
        <aura:attribute name="columns" type="List"/>
        <aura:attribute name="errors" type="Object"/>
        <aura:attribute name="draftValues" type="Account_RB__c" default="[]"
        />
    
        <div class="slds-p-around_medium">
            <h1 class="slds-text-heading_medium">Potential and Share of wallet</h1>
        </div>
        <div style="height: 600px">
            <lightning:datatable
                aura:id="rbTable"
                columns="{!v.columns}"
                data="{!v.data}"
                keyField="Id"
                hideCheckboxColumn="true"
                errors="{!v.errors}"
                draftValues="{!v.draftValues}"
                onsave="{!c.handleSaveEdition}"
                oncellchange="{! c.onCellChange }"
            />
        </div>

regards
Peter