Lightning Web Componets: navigate to the 'new' object page passing in specific record type Id?

Question

I am using LWCs to display lightning cards in a list.  The list shows information about Programs.  Each Program card has a button, and this button needs to take the user to the 'new object' screen of the Application object.  Here is my code:

applyToProgram(event) {
    // The recordTypeId is coming from the .html
    // I have verified that the value is correct.
    var rtId = event.target.id;

// How do I use rtId below?
    this[NavigationMixin.Navigate]({
        type: 'standard__objectPage',
        attributes: {
            objectApiName: 'Application__c',
            actionName: 'new',
            nooverride: '1',
            recordTypeId: rtId  // This does not work
        }
    });
}

This is not working.  The user is presented with the 'new object' screen for the object's default record type and NOT the one specified in rtId.  I tried putting 'nooverride' and 'recordTypeId' in the state:{} argument, and I also renamed 'recordTypeId' to just 'recordType'.  None of these worked.

Can anyone help me with the correct syntax?  Is this even possible in LWCs?

Thanks,
Jeff

Jayant Das · Accepted Answer

I have also posted this idea to allow for such a feature in LWC.

It seems as of today, you cannot specify a record type id in LWC while utilizing NavigationMixin.Navigate to create a new record.

The attributes mentioned for standard__objectPage are only:

actionName
objectApiName
filterName

There's no option available even on standard__recordPage which you could have utilized here. With all my experiences, something not documented is less likely to work (even if it does, it's not officially supported and could break at any point).

Your only option here could be to utilize an aura component composition and be able to use force:createRecord, as it does provide you a way to specify a recordTypeId.

Zakeer · Answer

Follow the below procedure, to have a different record type at the time of creation of new record.
I have used capital R for RecordTypeID, it didn't work. when changed to small 'r' like this recordTypeID, showed the expected result. As per the @track SelectedValue, it will show the particular page layout.
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';

export default class RecordTypeSelection extends NavigationMixin(LightningElement) {
@track selectedValue;

handleChange(event) {
        this.selectedValue = event.detail.value;
    }

const defaultValues = encodeDefaultFieldValues({
            Name: this.AccountName,
            BillingStreet: this.Street,
            BillingCity: this.City,
            BillingStateCode: this.StateCode,
            BillingCountryCode: this.CountryCode,
            BillingPostalCode: this.PostalCode

});

// Navigate to the Account home page
        this[NavigationMixin.Navigate]({
            type: 'standard__objectPage',
            attributes: {
                objectApiName: 'Account',
                actionName: 'new'
            },
            state: {
                nooverride: '1',
                defaultFieldValues: defaultValues,
                recordTypeId: this.recordTypeValue

}
        });
}

Joshua Cruz · Answer

I did find a workaround/hack your welcome to try.
I looked at the URL when I Went to the account page, and hit the new button and I found a url that looks like this:
'/lightning/o/Account/new?useRecordTypeCheck=1&count=1'
So I tried:
this[NavigationMixin.Navigate]({
      type: 'standard__objectPage',
      attributes: {
        objectApiName: 'Account',
        actionName: 'new'
      },
      state: {
        useRecordTypeCheck: 1
      }
    });

Now when they hit my "Create Account" button it shows this:

This might fulfill your requirement, give it a shot.

prasen · Answer

try setting the recordType value as default value :

// How do I use rtId below?

import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';

this[NavigationMixin.Navigate]({

const defaultValues = encodeDefaultFieldValues({
            RecordTypeId: event.target.id,
        });

type: 'standard__objectPage',
        attributes: {
            objectApiName: 'Application__c',
            actionName: 'new',
            nooverride: '1',
        },
         state: {
                defaultFieldValues: defaultValues
            }
    });

Lightning Web Componets: navigate to the 'new' object page passing in specific record type Id?

4 Answers

Add your own answers!

Ask a Question