[Resolved:] Set value of the picklist field for the selected records to mass update in lightning web component.

SCENARIO 

While working on one of the requirements for a manufacturing sector solutions customer based out in Dallas, Texas there was a requirement to set selected value of picklist field to mass update of records in lightning web component.

CHALLENGE 

We have achieved this functionality of setting the value of picklist by creating  custom lightning web component. We have used custom javascript functions to update mass records. 

However, we got stuck with the issue of updating records for the selected value. 

APPROACH

To fulfill this requirement,we decided to create custom javascript functions to select multiple files and to assign values to each files. 

Below is a sample code for reference.

HTML Code:-

    <template>
      <lightning-card title="Account List"> 
        <div class="slds-m-around_medium" >

        
        <div class='slds-grid slds-gutters'>
          <div class='slds-col'>
            <lightning-input type="checkbox" onchange={handleSelectAllIndustryChk}
                             label="Select All" data-id="selectAllIndustry">
          </lightning-input>

          </div>
         </div>
         <template for:each={accounts} for:item="account" for:index="index">
          <div class='slds-grid slds-gutters' key={account.Name}>
            <div class='slds-col slds-m-top_large slds-size_1-of-7'>
              <lightning-input type="checkbox" name={account.Name} data-class="cus_IndustryHelper"
              onchange={handleIndustryCheckbox} data-id='IndustryTypeChk'>
              </lightning-input>
              </div>
              <div class='slds-col slds-size_3-of-7'>
                <lightning-input label="Account Name" type="text" value={account.Name}
                                  disabled="true">
                </lightning-input>
              </div>
              <div class='slds-col slds-size_3-of-7'>
                <lightning-combobox name={account.Name} label="Industry" data-id={account.Name}
                                    class="picklistContent"  dropdown-alignment="auto"
                                    placeholder="Select account Type" options={IndustryPicklist.data.values}
                                    onchange={handleIndustrySelectionChange} required>
                </lightning-combobox>
              </div>
          </div>
        </template>
      </div>
      </lightning-card>  
    </template>    
  

JavaScript Code:-

import { LightningElement, api, wire, track } from 'lwc';
import AccountList from '@salesforce/apex/AccountController.AccountList';
import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import Account_OBJECT from '@salesforce/schema/Account';
import Industry_FIELD from '@salesforce/schema/Account.Industry';
   
export default class DataTableInLwc extends LightningElement {
    
    @track accounts=[];
    @track selectedIndustryValues=[];
    
    

  @wire(AccountList)
  wiredfiles(result){
      
      if(result.data){
          this.accounts=result.data;
          
      }
      else{
          console.log('Data not found');
      }
    }


    @wire(getObjectInfo, { objectApiName: Account_OBJECT })

    AccountMetadata;

    @wire(getPicklistValues,

        {

            recordTypeId: '$AccountMetadata.data.defaultRecordTypeId',

            fieldApiName: Industry_FIELD

        }

    )

    IndustryPicklist;
    
   

    handleSelectAllIndustryChk(event) {
    this.selectedIndustryValues = [];
    var checkboxes = this.template.querySelectorAll('[data-id="IndustryTypeChk"]');
    for (var i = 0; i < checkboxes.length; i++) {
        checkboxes[i].checked = event.target.checked;
        event.target.checked ? this.selectedIndustryValues.push(checkboxes[i].name) : '';
        }
    }

        
        handleIndustryCheckbox(event) {
            if (event.target.checked) {
                this.selectedIndustryValues.push(event.target.name);
                let checkboxes = this.template.querySelectorAll('[data-class="cus_IndustryHelper"]');
                let length = 0;
                for (var i = 0; i < checkboxes.length; i++) {
                    (checkboxes[i].checked == true) ? length = length + 1: length = length - 1;
                }
                ((checkboxes.length) == length) ? this.template.querySelectorAll('[data-id="selectAllIndustry"]')[0].checked = true: this.template.querySelectorAll('[data-id="selectAllIndustry"]')[0].checked = false;
            } else {
                this.selectedIndustryValues.splice(this.selectedIndustryValues.indexOf(event.target.name), 1);
                this.template.querySelectorAll('[data-id="selectAllIndustry"]')[0].checked = false;
                length -= 1;
            }
        }
            
        handleIndustrySelectionChange(event)
        {
            if (this.selectedIndustryValues.indexOf(event.target.name) != -1) {
                for (var i = 0; i < this.selectedIndustryValues.length; i++) {
                var selected = this.template.querySelectorAll('[data-id="' + this.selectedIndustryValues[i] + '"]')[0];
                selected.value = event.target.value;
                   }
                }
        }



}  

• handleSelectAllIndustryChk:- By clicking select all checkbox it will check all the checkboxes.

• handleIndustryCheckbox:- Checks for checkboxes to see whether it is selected or
    unselected.

• handleIndustrySelectionChange:- Used when value is selected from the picklist 
  and assigns that value to each and every selected picklist.

Apex Class:-

public with sharing class AccountController {
    @AuraEnabled(cacheable=true)
    public static List<Account> AccountList() {
        return [SELECT Id, Name ,Industry FROM Account LIMIT 5 ];
    }
}

OUTPUT:-

CONCLUSION

 

By using above mentioned javascript functions, We are able to set selected value of picklist field based for bulk/mass update records in lightning web component.

If you have any questions you can reach out our Salesforce Consulting team here.

[Resolved:] File Upload using REST API from Salesforce to SharePoint with special characters in filename.

SCENARIO

While working on one of the requirements for a packaging solutions customer based out Atlanta, Georgia there was a requirement to allow Salesforce users to upload documents from Salesforce entities.

Due to Salesforce storage limitation, uploaded documents are stored into SharePoint.

CHALLENGE

We have achieved functionality of uploading a file from Salesforce to SharePoint by creating custom lightning web component. We have used SharePoint REST APIs for direct upload from Salesforce to SharePoint.

However, we got stuck with the error while uploading a file contains special characters. 

RESOLUTION

We tried various solutions to resolve the issue but no luck. After relentless efforts, we concluded to utilize simple JavaScript function which encodes given file name and upload to SharePoint with the same name through REST APIs. Finally, it does the trick. Below is the sample for the same:

var updatedFileName = encodeURIComponent(this.files.name);
var url1 = 'https://br.sharepoint.com/sites/SFUpload' + "/_api/web/GetFolderByServerRelativePath('/Sites//SFUpload/Document Library')/Files/AddUsingPath(overwrite=true,decodedurl='" + updatedFileName + "')";

CONCLUSION

By encoding the file name, we are successfully able to upload a file with special characters from Salesforce to SharePoint.

If you have any questions you can reach out our Salesforce Consulting team here.