Play Games

Search This Blog

Saturday, May 21, 2022

display prompt dialog box in Lightning Web Component(LWC) - SalesforceGlobe4U

Solution: Use LightningPrompt module to show prompt box in lightning web component.

Example:

showPromptBoxInLWC.html

<template>

    <lightning-card>

        <lightning-button label="Show Prompt Dialog" onclick={showPrompt}></lightning-button>

    </lightning-card>

</template>

showPromptBoxInLWC.js

import { LightningElement } from 'lwc';

import LightningPrompt from 'lightning/prompt';

export default class ShowPromptBoxInLWC extends LightningElement {

    async showPrompt() {

        await LightningPrompt.open({

            message:'Welcome to Lightning Prompt in LWC',

            label:'Are you intrested to Learn Lightning Prompt?'

        }).then((result) => {

            console.log('Prompt: ',result);

        });

    }

}

showPromptBoxInLWC.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>

<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">

    <apiVersion>54.0</apiVersion>

    <isExposed>true</isExposed>

    <targets>

        <target>lightning__RecordPage</target>

        <target>lightning__AppPage</target>

        <target>lightning__HomePage</target>

    </targets>

</LightningComponentBundle>

Output:





No comments:

Post a Comment