function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
firstqa systemfirstqa system 

modal pop up when i delete the record by using lwc

java script:

import { LightningElement, track, wire } from 'lwc';
import getDealers from '@salesforce/apex/OppTableContoller.getDealers';
import { NavigationMixin } from 'lightning/navigation';
import {ShowToastEvent} from 'lightning/platformShowToastEvent';
import {refreshApex} from '@salesforce/apex';
import {deleteRecord} from 'lightning/uiRecordApi'

const actions = [
    { label: 'View', name: 'view' },
    { label: 'Edit', name: 'edit' },
    { label: 'Delete', name: 'delete' },
  ];
const columns = [
 //  { label:'Opportunity Name', fieldName: 'oppLink', type: 'url', typeAttributes: {label: {fieldName: 'Name'}, tooltip:'Go to detail page', target: '_blank'}},
   { label: 'Name', fieldName: 'Link',type:'url', typeAttributes: {label: {fieldName: 'Name'}, tooltip:'Go to detail page', target: '_blank'}}, 
   { label: 'Dealer_code__c', fieldName: 'Dealer_code__c' },
   { label: 'Dealer_Contact_Person__c', fieldName: 'Dealer_Contact_Person__c' },
   { label: 'Dealer_Mobile__c', fieldName: 'Dealer_Mobile__c' },
   { label: 'Dealer_E_Mail__c', fieldName: 'Dealer_E_Mail__c' },
   { label: 'Service_catgories__c', fieldName: 'Service_catgories__c' },
   { label: 'Transport_Assistance__c', fieldName: 'Transport_Assistance__c' },
   { label: 'Company_Contract_Start_Date__c', fieldName: 'Company_Contract_Start_Date__c' },
   { label: 'Company_Contract_End_Date__c', fieldName: 'Company_Contract_End_Date__c' },
   {
    type: 'action',
    typeAttributes: { rowActions: actions },
}, 
   
];
export default class OppTable extends NavigationMixin( LightningElement ) {
    @track error;
    @track columns = columns;
    @track opps; 
    @track showTable = false;  
    @track recordsToDisplay = []; 
    @track rowNumberOffset; 
    @wire(getDealers)
   
    wopps({error,data}){
        if(data){
            let recs = [];
            for(let i=0; i<data.length; i++){
                let opp = {};
                opp.rowNumber = ''+(i+1);
                opp.Link = '/'+data[i].Id;
                opp = Object.assign(opp, data[i]);
                recs.push(opp);
            }
            this.opps = recs;
            this.showTable = true;
        }else{
            this.error = error;
        }   
    }
    navigateToNewdealerPage() {
        this[NavigationMixin.Navigate]({
            type: 'standard__objectPage',
            attributes: {
                objectApiName: 'Dealer__c',
                actionName: 'new',
              
            },
        });
    }
    handleRowAction( event ) {
        const actionName = event.detail.action.name;
        const row = event.detail.row;
        switch ( actionName ) {
            case 'view':
                this[NavigationMixin.Navigate]({
                    type: 'standard__recordPage',
                    attributes: {
                        recordId: row.Id,
                        actionName: 'view'
                    }
                });
                break;
            case 'edit':
                this[NavigationMixin.Navigate]({
                    type: 'standard__recordPage',
                    attributes: {
                        recordId: row.Id,
                        objectApiName: 'Dealer__c',
                        actionName: 'edit'
                    }
                   
                });

                break;
             //   window.location.reload();
            case'delete':
            var txt;
            var r = confirm("Are you sure you want to delete?");
            if(r == true){
               this.recordId = event.target.value;
               deleteRecord(row.Id) 
               .then(() =>{
           
                  const toastEvent = new ShowToastEvent({
                      title:'Record Deleted',
                      message:'Record deleted successfully',
                      variant:'success',
                     
                     
                     
                  })
                  this.dispatchEvent(toastEvent);
                 //return refreshApex(this.data);
                 
                 
                 
                 
                   

                
                 window.location.reload();
           
                 
                  
                  
               })
            }
               
               else{
                   txt ="you have selected cancel "
              
               }
               break;
            default:
        }
    }
      
  
    handlePaginatorChange(event){
        this.recordsToDisplay = event.detail;
        this.rowNumberOffset = this.recordsToDisplay[0].rowNumber-1;
    }
}

---------------------------------------------------------------------------------------------------

html:

<template>
    <lightning-card title="Data Table with Pagination">
        <template if:true={showTable}>
            
          <lightning-button label="New dealer" onclick={navigateToNewdealerPage} class="slds-float_left"></lightning-button> 
            <c-paginator records={opps} 
                        total-records={opps.length} 
                        show-search-box="true" 
                        onpaginatorchange={handlePaginatorChange}>
            </c-paginator>
            <lightning-datatable key-field="Id" 
                                data={recordsToDisplay} 
                                columns={columns}
                                onrowaction={handleRowAction}
                                hide-checkbox-column
                                show-row-number-column
                                row-number-offset={rowNumberOffset}>
            </lightning-datatable>
        </template>
    </lightning-card>
</template>

----------------------------------------------------------------------------------------------------
apex
public with sharing class OppTableContoller {    
    @AuraEnabled(cacheable=true)
    public static List< Dealer__c> getDealers() {
        return [SELECT Id, Dealer_code__c, Name, Dealer_Contact_Person__c, Dealer_Mobile__c, Dealer_E_Mail__c, Service_catgories__c, Transport_Assistance__c, Company_Contract_Start_Date__c, Company_Contract_End_Date__c FROM Dealer__c ];
    }
}


here i am performing lwc row actions edit and delete and serach operation in lightning data table with pagination my reuirement is when i delete a record i need modal popup message stating are sure u want delete and after delete it should automatically refreshed 

so plz help me 

thanks in advance

syed e h mazhari
mazharibobby829@gmail.com
8328174785
ANUTEJANUTEJ (Salesforce Developers) 
Hi Syed,

>> https://salesforce.stackexchange.com/questions/191934/delete-row-with-confirm-dialogbox

The above link is an example of an implementation of how to have a model popup when there is a delete row action you can check this and implement the same for your use case.

Let me know if it helps you and close your query by marking it as solved so that it can help others in the future.  

Thanks.
firstqa systemfirstqa system
hi anutej i need in lwc  with java script and html
thanks for responding 
 
ANUTEJANUTEJ (Salesforce Developers) 
https://marcoalmodova.medium.com/a-lwc-confirmation-dialog-5aa486e301e4

This link is for LWC you can try checking.
JAVED AHMED 1JAVED AHMED 1
haii all,

can someone help me i need a pop up whenever i tried to del record
thanks in advanve
mahiahmed587@gmail.com

js file

import { LightningElement,track,wire } from 'lwc';
import {refreshApex} from '@salesforce/apex';
import {ShowToastEvent} from 'lightning/platformShowToastEvent';  
import { deleteRecord } from 'lightning/uiRecordApi'; 
import getAccounts from'@salesforce/apex/listOfAccount.getAccounts';
import { NavigationMixin } from 'lightning/navigation'; 
const actions = [
    { label: 'Delete', name: 'Delete' },
    { label: 'Edit', name: 'Edit' },
];
const columns = [   
    { label: 'Name', fieldName: 'Name',sortable:true,type:'text'},  
    { label: 'Industry', fieldName: 'Industry', sortable:true,type:'text' },
    {
        type:'action',
          typeAttributes:{ rowActions: actions },
    } 
]; 
export default class DisplayRecordWithDataTable extends NavigationMixin(LightningElement) {
     @track sortBy;
   @track sortDirection;
    @track data;
    @track columns = columns;
  doSorting(event) {
        this.sortBy = event.detail.fieldName;
        this.sortDirection = event.detail.sortDirection;
        this.sortData(this.sortBy, this.sortDirection);
    }
    sortData(fieldname, direction) {
        let parseData = JSON.parse(JSON.stringify(this.data));
        // Return the value stored in the field
        let keyValue = (a) => {
            return a[fieldname];
        };
        // cheking reverse direction
        let isReverse = direction === 'asc' ? 1: -1;
        // sorting data
        parseData.sort((x, y) => {
            x = keyValue(x) ? keyValue(x) : ''; // handling null values
            y = keyValue(y) ? keyValue(y) : '';
            // sorting values based on direction
            return isReverse * ((x > y) - (y > x));
        });
        this.data = parseData;
    }      
        
       @wire(getAccounts)
    accounts(result) {
        if (result.data) {
            let nameUrl;
            this.data = result.data;
            this.error = undefined;
        } else if (result.error) {
            this.error = result.error;
            this.data = undefined;
        }
    }
    callRowAction(event) {  
        const recId =  event.detail.row.Id;  
        const actionName = event.detail.action.name;  
        if ( actionName === 'Edit' ) {  
            this[NavigationMixin.Navigate]({  
                type: 'standard__recordPage',  
                attributes: {  
                    recordId: recId,  
                    objectApiName: 'Account',  
                    actionName: 'edit'  
                } 
            })  
  
        } else if ( actionName === 'Delete') {  
              deleteRecord(event.detail.row.Id)
            .then(()=>{
                this.dispatchEvent(new ShowToastEvent({
                    title: 'Success',
                    message: 'Record deleted successfully',
                    variant: 'success'
                }))
                window.location.reload();
               return refreshApex(this.getAccounts);
            })
  
    }
    }
}


html file
<template>
    <lightning-card title="Display Account Record List">
      <div class="slds-m-around_medium">  
         <template if:true = {accounts}>  
                  
               
        
<lightning-datatable data={data} columns={columns} key-field="id" hide-checkbox-column="false"  
                     show-row-number-column="true" 
                     onsort={doSorting} 
                      sorted-by={sortBy}
                      sorted-direction={sortDirection}
                        row-number-offset ="0"  
                        onrowaction={callRowAction}>
></lightning-datatable>
         </template>
          <template if:true = {error}>  
  
                {error}>  
                  
            </template>  
      </div>
    </lightning-card>
</template>