• flavia dcosta 2
  • NEWBIE
  • 0 Points
  • Member since 2021

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 0
    Questions
  • 2
    Replies
Hi All,
There are objects Vendor__c and Placement__c which are not related to each other. In component 1, I have two picklists "state" and "company".
On giving values to "state and company" and clicking "select" button, it should lists all the records matching state and company from object "Placement__c" in component 2.
Any help is appreciated.



VendorComponent
==============
<template>
    <lightning-record-edit-form object-api-name="Vendor__c">
        <lightning-input-field field-name="Vendor_First_Name__c"></lightning-input-field>
        <lightning-input-field field-name="Vendor_Last_Name__c"></lightning-input-field>
        <lightning-input-field field-name="Vendor_Phone__c" type="tel"></lightning-input-field>
        <lightning-input-field field-name="Vendor_Email__c"></lightning-input-field>
              <lightning-combobox
              name="st"
              label="State"
              value={value1}
              placeholder="Select State"
              options={options1}
              onchange={handleChange1} ></lightning-combobox>
              <lightning-combobox
              name="Com"
              label="Company"
              value={value2}
              placeholder="Select Company"
              options={options2}
              onchange={handleChange2} ></lightning-combobox>
        <lightning-button class="slds-m-top_small" variant="brand" type="submit" label="SAVE" onclick = {navigateToLightningComponent}></lightning-button>

    </lightning-record-edit-form>
</template>

==============================================
import { LightningElement,wire,api} from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
export default class VendorComponent extends LightningElement {
   
        get options1() {
        return [
            { label: 'Delhi', value: 'del' },
            { label: 'Maharashtra', value: 'mah' },
            { label: 'Kerala', value: 'ker' },
        ];
    }
    get options2() {
        return [
            { label: 'Company1', value: '1c' },
            { label: 'Company2', value: '2c' },
            { label: 'Company3', value: '3c' },
        ];
    }
    navigateToLightningComponent() {
        this[NavigationMixin.Navigate]({
            "type": "custom__component",
            "attributes": {
                
                "componentName": "c__payComponent"
            }
        });
    }
}
==============================================
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>51.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>
    
</LightningComponentBundle>
  • May 29, 2021
  • Like
  • 0
Hello All,
Implementing a basic navigation component. No error while pushing the code to the scratch org, but when i click on the navigation buttons no action. Below is the image of our component on Account Record page.

User-added image

NavigationinLWC1.html
<template>
    <lightning-card title="Navigation Service in Lightning Web Component">
        <lightning-card title="Navigation to Record Page">
            <lightning-button-group>
                <lightning-button label="New Record Page" onclick={navigateToNewRecordPage}></lightning-button>
                <lightning-button label="Edit Record Page" onclick={navigateToEditRecordPage}></lightning-button>
                <lightning-button label="View Record Page" onclick={navigateToViewRecordPage}></lightning-button>
            </lightning-button-group>
        </lightning-card>
    </lightning-card>    
</template>

NavigationinLWC1.js
import { LightningElement,api } from 'lwc';
import {NavigationMixin} from 'lightning/navigation'
export default class NavigationinLWC1 extends LightningElement {
    @api recordId;
    navigateToNewRecordPage(){
        this[NavigationMixin.Navigate]({
            type:'standard__recordPage',
            attribute:{
                "recordId":this.recordId,
                "objectApiName":"Account",
                "actionName": "new"
            }
        });
    }

    navigateToEditRecordPage(){
        this[NavigationMixin.Navigate]({
            type:'standard__recordPage',
            attribute:{
                "recordId":this.recordId,
                "objectApiName":"Account",
                "actionName": "edit"
            }
        });
    }

    navigateToViewRecordPage(){
        this[NavigationMixin.Navigate]({
            type:'standard__recordPage',
            attribute:{
                "recordId":this.recordId,
                "objectApiName":"Account",
                "actionName": "view"
            }
        });
    }
}

Kindly help me out.