You need to sign in to do that
Don't have an account?
Sachin Bhalerao 17
Component not appearing in App builder need solution
Dear Team ,
I created component to insert data , command ran successfully but component not appears in any App Builder (Home,Record,App). However i created component for slider, to delete and update records that components appears in app Builder . Kindly have a look on my code and plz provide me some solution .
Or Please send me some code through which i am able to unserstand how data will get inserted through LWC
1)Apex Class:
public inherited sharing class LWCExampleController { @AuraEnabled public static void saveAccountRecord(Account objAcc){ try{ insert objAcc; } catch(Exception ex) { throw new AuraHandledException(ex.getMessage()); } } }
2)createRecordInLWC.html:
<template>
<lightning-card title="Create Account Record" icon-name="standard:account">
<div style="margin-left: 6%" if:true={error}>
<lightning-badge label={error} style="color: red;"></lightning-badge>
</div>
<template if:true={accRecord}>
<div class="slds-m-around--xx-large">
<div class="container-fluid">
<div class="form-group">
<lightning-input label="Enter Account Name" name="accName" required="required" type="text" value={accRecord.Name} onchange={handleNameChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Phone Number" name="accPhone" type="number" value={accRecord.Phone} onchange={handlePhoneChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Account Type" name="accEmail" required="required" type="text" value={accRecord.Type} onchange={handleTypeChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Industry" name="accEmail" type="text" value={accRecord.Industry} onchange={handleIndustryChange}></lightning-input>
</div>
</div>
<br/>
<lightning-button label="Submit" onclick={handleSave} variant="brand"></lightning-button>
</div>
</template>
</lightning-card>
</template>
3)createRecordInLWC.js:
import { LightningElement, track} from 'lwc';
// Importing Apex Class method
import saveAccount from '@salesforce/apex/LWCExampleController.saveAccountRecord';
// importing to show toast notifictions
import {ShowToastEvent} from 'lightning/platformShowToastEvent';
// importing Account fields
import NAME_FIELD from '@salesforce/schema/Account.Name';
import Phone_FIELD from '@salesforce/schema/Account.Phone';
import Industry_FIELD from '@salesforce/schema/Account.Industry';
import Type_FIELD from '@salesforce/schema/Account.Type';
export default class CreateRecordInLWC extends LightningElement {
@track error;
// this object have record information
@track accRecord = {
Name : NAME_FIELD,
Industry : Industry_FIELD,
Phone : Phone_FIELD,
Type : Type_FIELD
};
handleNameChange(event) {
this.accRecord.Name = event.target.value;
window.console.log('Name ==> '+this.accRecord.Name);
}
handlePhoneChange(event) {
this.accRecord.Phone = event.target.value;
window.console.log('Phone ==> '+this.accRecord.Phone);
}
handleTypeChange(event) {
this.accRecord.Type = event.target.value;
window.console.log('Type ==> '+this.accRecord.Type);
}
handleIndustryChange(event) {
this.accRecord.Industry = event.target.value;
window.console.log('Industry ==> '+this.accRecord.Industry);
}
handleSave() {
saveAccount({objAcc: this.accRecord})
.then(result => {
// Clear the user enter values
this.accRecord = {};
window.console.log('result ===> '+result);
// Show success messsage
this.dispatchEvent(new ShowToastEvent({
title: 'Success!!',
message: 'Account Created Successfully!!',
variant: 'success'
}),);
})
.catch(error => {
this.error = error.message;
});
}
}
4)createRecordInLWC.js.meta-xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="CreateRecordInLWC">
<apiVersion>46.0</apiVersion>
<isExposed>false</isExposed>
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
</targets>
</LightningComponentBundle>
Thanks & Regards
Sachin Bhalerao
I created component to insert data , command ran successfully but component not appears in any App Builder (Home,Record,App). However i created component for slider, to delete and update records that components appears in app Builder . Kindly have a look on my code and plz provide me some solution .
Or Please send me some code through which i am able to unserstand how data will get inserted through LWC
1)Apex Class:
public inherited sharing class LWCExampleController { @AuraEnabled public static void saveAccountRecord(Account objAcc){ try{ insert objAcc; } catch(Exception ex) { throw new AuraHandledException(ex.getMessage()); } } }
2)createRecordInLWC.html:
<template>
<lightning-card title="Create Account Record" icon-name="standard:account">
<div style="margin-left: 6%" if:true={error}>
<lightning-badge label={error} style="color: red;"></lightning-badge>
</div>
<template if:true={accRecord}>
<div class="slds-m-around--xx-large">
<div class="container-fluid">
<div class="form-group">
<lightning-input label="Enter Account Name" name="accName" required="required" type="text" value={accRecord.Name} onchange={handleNameChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Phone Number" name="accPhone" type="number" value={accRecord.Phone} onchange={handlePhoneChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Account Type" name="accEmail" required="required" type="text" value={accRecord.Type} onchange={handleTypeChange}></lightning-input>
</div>
<div class="form-group">
<lightning-input label="Enter Industry" name="accEmail" type="text" value={accRecord.Industry} onchange={handleIndustryChange}></lightning-input>
</div>
</div>
<br/>
<lightning-button label="Submit" onclick={handleSave} variant="brand"></lightning-button>
</div>
</template>
</lightning-card>
</template>
3)createRecordInLWC.js:
import { LightningElement, track} from 'lwc';
// Importing Apex Class method
import saveAccount from '@salesforce/apex/LWCExampleController.saveAccountRecord';
// importing to show toast notifictions
import {ShowToastEvent} from 'lightning/platformShowToastEvent';
// importing Account fields
import NAME_FIELD from '@salesforce/schema/Account.Name';
import Phone_FIELD from '@salesforce/schema/Account.Phone';
import Industry_FIELD from '@salesforce/schema/Account.Industry';
import Type_FIELD from '@salesforce/schema/Account.Type';
export default class CreateRecordInLWC extends LightningElement {
@track error;
// this object have record information
@track accRecord = {
Name : NAME_FIELD,
Industry : Industry_FIELD,
Phone : Phone_FIELD,
Type : Type_FIELD
};
handleNameChange(event) {
this.accRecord.Name = event.target.value;
window.console.log('Name ==> '+this.accRecord.Name);
}
handlePhoneChange(event) {
this.accRecord.Phone = event.target.value;
window.console.log('Phone ==> '+this.accRecord.Phone);
}
handleTypeChange(event) {
this.accRecord.Type = event.target.value;
window.console.log('Type ==> '+this.accRecord.Type);
}
handleIndustryChange(event) {
this.accRecord.Industry = event.target.value;
window.console.log('Industry ==> '+this.accRecord.Industry);
}
handleSave() {
saveAccount({objAcc: this.accRecord})
.then(result => {
// Clear the user enter values
this.accRecord = {};
window.console.log('result ===> '+result);
// Show success messsage
this.dispatchEvent(new ShowToastEvent({
title: 'Success!!',
message: 'Account Created Successfully!!',
variant: 'success'
}),);
})
.catch(error => {
this.error = error.message;
});
}
}
4)createRecordInLWC.js.meta-xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="CreateRecordInLWC">
<apiVersion>46.0</apiVersion>
<isExposed>false</isExposed>
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
</targets>
</LightningComponentBundle>
Thanks & Regards
Sachin Bhalerao
Change <isExposed>false</isExposed> to <isExposed>true</isExposed>
then you should be good.