onGroup: function (component,event,helper) { var getWhichBtn = event.getSource ().get ("v.label"); component.set ("v.storeRadioValue", getWhichBtn); alert (getWhichBtn); } on the change of the radio button lable value is store in the storeRadioValue attribute so on the button click you can get the lable value from attribute by using
Full Answer
What is Lightning-Radio-Group component?
A lightning-radio-group component represents a group of radio buttons that permit only one button to be selected at a time. The component renders radio button <input> elements and assigns the same value to the name attribute for each element.
How do I create radio buttons?
To create radio buttons, pass in the following properties to the options attribute. The text that displays next to a radio button. The string that's used to identify which radio button is selected. Client-side input validation is available for this component.
What happens when a radio button selection is disabled?
When a user interacts with the radio button group and doesn't make a selection, an error message is displayed. If the disabled attribute is specified, radio button selections can't be changed. This example creates a radio button group with two options and option1 is selected by default.
What is the common name attribute in Lightning radio groups?
The common name attribute joins the elements in a group. If you select any radio button in that group, any previously selected button in the group is deselected. In general, we don't recommend setting the name attribute in lightning:radioGroup. The component automatically generates a unique value for name if none is provided.
How do you use the radio button in the lightning component?
Set type="button" to create a component that inherits styling from Radio Button Group in the Lightning Design System. This example creates a radio group with two options and option1 is selected by default. The name radioButtonGroup is assigned so that only one button can be selected.
How do you get the selected value in the lightning component?
You can easily get the selected value by using component. find("aura:id"). get("v. value");
How do you get the input field value in a controller in Salesforce lightning?
To get the value of the input field directly you could try adding the aura:id="someId" attribute to the
How do you know which button is clicked in lightning component?
In the client-side controller, you can use one of the following methods to find out which button was clicked.event. getSource(). getLocalId() returns the aura:id of the clicked button.event. getSource(). get("v.name") returns the name of the clicked button.
How do you use the input field in a lightning component?
Use the lightning:inputField component in lightning:recordEditForm to display and edit the value of a record field on a Salesforce object. Use the fieldName attribute to specify the API field name....A name compound field on records includes these constituent fields:FirstName.MiddleName.LastName.Salutation.Suffix.
How do I set the default picklist value in lightning component?
To do this, click on a picklist field and click edit on the values assigned to the picklist. Click edit on value and you will see the default option. Now we can edit any existing picklists or create new ones and set the default value. Hope this helps on your salesforce journey!
How do you display output fields in lightning component?
Use the lightning-output-field component in lightning-record-view-form to display the value of a record field on a Salesforce object. Use the field-name attribute to specify the API field name.
What are the two ways we can use to get data into the lightning component?
There are two methods to get the values. 1 - Add an aura:attribute to your component and then set it as the 'value' attribute on the lightning:select. 2 - Add an aura:id attribute to your lightning select, then in the controller use component.
How do I get element by ID in LWC?
“get element by id in lwc” Code Answerlet firstClass = this. template. querySelector(".first-class");let secondClasses = firstClass. querySelectorAll(".second-class");secondClasses[2]. value = 'Some Value';
What is event getSource ()?
event. getSource() helps you determine which component fired an event.
How do I find my aura ID in lightning component?
Use aura:id to add a local ID of button1 to the lightning:button component. You can find the component by calling cmp. find("button1") , where cmp is a reference to the component containing the button. The find() function has one parameter, which is the local ID of a component within the markup.
How do I transfer data from lightning to iframe?
You can use postMessage() to communicate between your Lightning Component and the content of the iframe.
What is lightning radio group?
A lightning:radioGroup component represents a group of radio buttons that permit only one button to be selected at a time. The component renders radio button <input> elements and assigns the same value to the name attribute for each element. The common name attribute joins the elements in a group.
What happens when you don't select a radio button?
When a user interacts with the radio button group and doesn't make a selection, an error message is displayed.
Can radio button selections be changed?
If the disabled attribute is true, radio button selections can't be changed.
Can you select only one value across all radio button groups?
The result is that you can select only one value across all radio button groups, instead of one value within a radio button group. If you require your own name value, enclose the reused components in <form> elements to enable the page to use the same name value for multiple radio button groups.
What is lightning radio group?
A lightning-radio-group component represents a group of radio buttons that permit only one button to be selected at a time. The component renders radio button <input> elements and assigns the same value to the name attribute for each element. The common name attribute joins the elements in a group. If you select any radio button in ...
How to change line height of button in SLDS?
When using type="button", you can change the line height of the button label with SLDS styling hooks. For example, use --sds-c-button-line-height to reduce or increase the whitespace between lines of the text label.
What is the legend element?
The legend contains the label value. The fieldset element enables grouping of related radio buttons to facilitate tabbing navigation and speech navigation for accessibility purposes. Similarly, the legend element improves accessibility by enabling a caption to be assigned to the fieldset.
What is type="button" in SLDS?
Set type="button" to create a component that implements the radio button group blueprint in SLDS.
What happens if you don't select a radio button?
When a user interacts with the radio button group and doesn't make a selection, an error message is displayed. If the disabled attribute is specified, radio button selections can't be changed.
When using type="radio", what is the custom style?
When using type="radio", customize the component's styles using SLDS styling hooks from the radio group blueprint. For example, change the radio color background and checkmark.
How to display error messages on invalid fields?
To programmatically display error messages on invalid fields, use the reportValidity () method. For custom validity error messages, display the message using setCustomValidity () and reportValidity (). For more information, see the lightning-input documentation.
Input Validation
- Client-side input validation is available for this component. For example, an error message is displayed when the radio group is marked required and no option is selected. Note that a disabled radio group is always valid. You can override the default message using message-when-value-missingwhen a radio group is required and no option is selected. This message is displayed whe…
Reusing Lightning-Radio-Group in A Page
- To reuse lightning-radio-groupin a page or across multiple tabs such as in a Salesforce console app, follow one of these suggestions. 1. Omit the nameattribute to enable the component to automatically generate a unique name. 2. Enclose each lightning-radio-group component in a <form> element and provide your own value for name. If the reused component generates a uniq…
Component Styling
- lightning-radio-group implements the radio buttonblueprint in the Salesforce Lightning Design System (SLDS). Set type="button" to create a component that implements the radio button groupblueprint in SLDS. Use the variantattribute with one of these values to change the appearance of the radio group. 1. label-hiddenhides the radio group label but ma...
Accessibility
- The radio group is nested in a fieldset element that contains a legend element. The legend contains the label value. The fieldset element enables grouping of related radio buttons to facilitate tabbing navigation and speech navigation for accessibility purposes. Similarly, the legend element improves accessibility by enabling a caption to be assigned to the fieldset.
Source Code
- lightning-radio-group is available in the Base Components Recipes GitHub repository. It's transpiled into the cnamespace so that you can use it in your own projects.