Questions tagged [lightninginput]

Custom lightning input field can take on different display characteristics depending on 'type' property. A lightning-input component creates an HTML <input> element. This component supports the following input types: checkbox checkbox-button date datetime time email file password search tel url number text (default) toggle

Filter by
Sorted by
Tagged with
0 votes
0 answers
58 views

How can I give a disabled `lightning-input` a background color?

I have successfully given enabled lightning-input fields in my app background colors using --slds-c-input-color-background, but this seems to be ignored (removed) from the final page rendering. How ...
  • 805
0 votes
1 answer
57 views

setCustomValidity() working only on first row of dynamic table lightning

I have a requirement where I need to dynamically add/remove table rows and add custom validation on each row in LWC. I achieved dynamically adding and deleting rows but while adding setCustomValidity()...
1 vote
0 answers
89 views

Lightning-input vs lightning-input-field

I am facing issues with using both Lightning-input and lightning-input-field. Some of my requirements are satisfied with Lightning-input and some with lightning-input-field.Here are issues faced. ...
0 votes
1 answer
116 views

Change label colour lightning-input LWC

Hello guys I am trying to change the label colour of a lightning-input in a Community that has a green default colour. I tried this approach: <lightning-combobox label="Item" class="...
  • 77
0 votes
1 answer
53 views

Help disabling calendar pop up

My client wants to use the date type on a lightning:input component, but wants the date picker calendar disabled. I have tried toying with the CSS, but that really isn't my strength. They're unwilling ...
0 votes
1 answer
42 views

avoid deleting all files LWC

Hello I am working on a lightning-input field whose type is a file. In this component I want to allow the users to upload several files and show its name and an option to delete the selected file the ...
  • 77
1 vote
1 answer
80 views

How to prevent LastPass from displaying icon inside lightning-input

Based on this LastPass guidance I've tried data-lpignore and data-lpignore="true", per this markup: <lightning-input if:true={colmod.showme} required={colmod.required} ...
  • 509
0 votes
2 answers
123 views

Why lightning:input type=number is no longer rendered as input type=number?

Why lightning:input type=number is no longer rendered as input type=number? Earlier, when we were using <lightning:input type=number/>, it was rendering as <input type=number> and was ...
  • 14.8k
0 votes
0 answers
32 views

Applying simultaneous filters to datatable

I have four LWC components: - A datatable that displays data - An input text field - A dual listbox - Another dual listbox I need to make input field and both dual listbox work as simultaneous filters ...
1 vote
1 answer
464 views

'Upload files or drop files' to 'Upload file or drop file'

How can I change the 'Upload files or drop files' text to 'Upload file or drop file'. When I am allowing single file upload in lightning-input component.
0 votes
1 answer
35 views

Cannot get data in HTML

With this code, I get my data, it is visible in the console, however I think I made an error in HTML because I can't display anything, a little help please Please on how to fix this, I want to display ...
0 votes
0 answers
84 views

slds-input css doesn't work

Hello guys I have a doubt related with Lighning-input style. I'm trying to align the value inside the textbox to the right but it seems that my css is ignored by Salesforce. I have the following HTML: ...
1 vote
2 answers
1k views

LWC get element by value

Why can't I get element by value? I have tried to get id with var, just data and different quotes. //var = id; <lightning-input value={var}></lightning-input> this.template.querySelector(&...
  • 25
0 votes
1 answer
395 views

How to retain user-input in lightning input field

I created an LWC in which I have 3 parts on a page: (here Allergy & Medication are visible). 1st page has 2 input fields, and to view each part of the page, a boolean variable is used (template ...
0 votes
0 answers
288 views

WYSIWYG editor in Lwc

I have tried using lightning-input-rich-text component to create a WYSIWYG in LWC but given its issues with table (hitting backspace on table content deletes whole table) and image (unable to resize ...
0 votes
0 answers
995 views

LWC lightning-input Currency

In Lightning Web Components (LWC) the 'lightning-input' component supports a 'formatter' attribute which has value 'currency' and this displays decimal values with currency formatting, for example: 1....
1 vote
1 answer
559 views

change even on datetime input field does not track time

I am using a datetime input field in LWC: <lightning-input type="datetime" name="input5" label="ADate Time" value={avlue} min={minEndDate} max={maxEndDate} onchange=...
  • 4,681
0 votes
1 answer
152 views

Search input bar layout

I'm trying to use a lightning input type search to make a search bar that I will connect to a database to search throught all my items (but this is not the problem) I would like to show the search bar ...
0 votes
1 answer
179 views

lightning-input checkbox - getting checked rows when submitted

When submit button is clicked, how do I know which rows have been checked? .html <template for:each={products.data} for:item="product"> <a href=&...
  • 593
0 votes
1 answer
348 views

Date format in lightning-input after changed input value format

An issue in Date format validation in lightning-input type Date: After I changed the input value format according to the latest Salesforce updated ICU locale format for Ireland. The last column shows ...
0 votes
1 answer
363 views

How to insert image into lightning-input-rich-text programmatically?

I have an image in base64 format and I want to push the image data explicitly into my lightning-input-rich-text. Is there any way? My code looks like this: <lightning-input-rich-text value={...
0 votes
1 answer
155 views

What is the use of messageWhenTooLong function in lightning input or textarea

What is the use of messageWhenTooLong function in lightning input or textarea. In practice, the lightning-input element appears to prevent the user from entering any characters beyond the number ...
-2 votes
1 answer
422 views

Concatenate Label with static text and dynamic vales

I have a lightning input where I'd like to create a dynamic label. When I deploy this component I don't have any errors; however, the UI displays "Please enter the {item.fieldValue}" in the ...
0 votes
1 answer
4k views

Lightning input of type text in LWC accepts blank space as input when set to required - how to get rid of it

<lightning-input type="text" name="masterLabel" class="validate" label="Enter the Master Label" value={masterLabelValue} onchange={handleMasterLabelChange} ...
  • 3
0 votes
1 answer
1k views

Lightning input Toggle - LWC [closed]

I’m working with multiple toggles in a template for bucle and I’m trying to find a way to identify the specific toggle that is enabled/disabled, I can’t use something like this: this.template....
0 votes
0 answers
432 views

How to display different input types(checkbox radio text) according to the user's preference in lwc

This is the current preview of my app where when i click a particular survey the corresponding question and answer is displayed.I want to modify the answers in such a way that answer type can be ...
user avatar
0 votes
0 answers
352 views

select lightning input checkbox by name in aura

I want to select the lightning input checbox by name from my Aura component controller. How can I do that? <lightning:input type="checkbox" label="{!parentBenefit.Name}" name=&...
  • 329
0 votes
1 answer
288 views

Unable to set required attribute for lightning input

I'm currently looking to change the required attribute based on multiple scenarios. So, I have a created input field with the required attribute as newAccRequire but by default, it's getting the true ...
  • 1,448
1 vote
1 answer
468 views

Force capital letters in a lightning-input element

Is there any way to capitalize the letters from a lightning-input (type text) in html? I'm using this in a lightning-datatable and when a use insert a lowercase field, it's sorted before the capital ...
0 votes
0 answers
253 views

Is there a way to pass sobject record from html to lwc on radio button change

I am displaying list of contacts in table in lwc. I have a radio button placed in each row of the table. On clicking that, I'm able to send the contact record id but I want to send that particular ...
0 votes
1 answer
1k views

Lightning Input with: Read Only but with Borders

I have a Lightning component with a form. This form has some fields as Read Only and some others editable. I use Lightning input with the property readonly. The issue is that on the ones that are ...
0 votes
1 answer
669 views

How to make https optional in lightning input type url in lwc

I want to make https or http optional in my url type input field. But I always get invalid format error. I've tried regex pattern as well, but no luck. HTML Code: <lightning-input type="url&...
  • 29
0 votes
1 answer
555 views

How to make input element read only on button click

<lightning-input value={value} class="slds-p-horizontal--xx-small" variant="label-hidden"></lightning-input> <lightning-input type="number" name="...
  • 29
0 votes
1 answer
1k views

Lightning:input required="true" is not working [closed]

I'm using a required field for an aura component that should does not save a record if any of required fields is missing. This is my input: <lightning:input aura:id="test" name="test&...
  • 185
0 votes
1 answer
33 views

Extra textbox before input component

It seems that there's an extra textbox that I can type into, but I'm not sure what's causing it in the code. I only get to this extra textbox when tabbing through elements on the page. I have added ...
  • 25
0 votes
1 answer
2k views

How to set maxlength for lightning-input-rich-text

How can we limit the number of characters entered in rich text field lightning field <lightning-input-rich-text value={myVal}> </lightning-input-rich-text> Is there any ...
  • 133
1 vote
1 answer
224 views

Control binding for aura attribute being passed from parent to child

I am taking record id and object name as input from user <aura:attribute name="recordidinput" type="Id" /> <aura:attribute name="objectname" type="...
-1 votes
1 answer
919 views

LWC Html table with lightning-input onchange giving error

I have a html table in my LWC child component which is populated from the parent. I am able to pass the values and display the data on the child component. On the child component the table has a ...
  • 13
0 votes
1 answer
487 views

lightning search input type is not displaying the expected result

I have search input box on searching the account names in the input box it should display the list of account names but i am unable to see the result i inspected my code but don't see any issues. Can ...
  • 117
1 vote
2 answers
3k views

How to align Lightning-input field-level-help with label when label is more than one line long?

I'm using a lightning-input. The label of the input is a bit too long and appears on two lines. When I add a field-level-help, instead of putting it on the second line where there is plenty of space, ...
1 vote
0 answers
973 views

Lightning Web Component 'lightning-input-rich-text' Change Font Size

I have a lightning-input-rich-text (LWC) in which I'd like to change the default text size from 12 to 10. On following the instructions in https://developer.salesforce.com/docs/component-library/...
0 votes
0 answers
588 views

lightning-input autosuggest

I have a LWC with a lightning-combobox whose options are populated via an apex query of records. The record list changes depending on the user accessing the LWC. There is one user for whom the query ...
0 votes
1 answer
306 views

event.setParam not working

Below is my code. My requirement is I want to uncheck a checkbox from the javascript controller based on some conditions. This is my code; HTML part <lightning:input type="checkbox" class=...
0 votes
0 answers
90 views

How do I open a new form and query the database at the same time?

On the current page, I have a "New" button that opens a new form, where I need to fill in the "Account" field as well. And I want to get a list of "Account" values ​​in ...
2 votes
1 answer
2k views

Radio button requires two clicks to "check" even though conditional template renders

I am working on a component that has a simple 2 option radio group. I want to show and hide a div (template if:true) based on the selected radio option. What I have here almost works but I have to ...
2 votes
0 answers
50 views

Aura component and LWC are not supporting Nepal locale

I have a requirement where I need to show date in Nepal locale in both Lightning Web and Aura components. This shows the date in, for example - २०२१/२/१७ format in Salesforce but on LWC and Aura, it ...
  • 41
1 vote
1 answer
838 views

Pass Lightning input iteration value by index of String array

I have a lightning component where I dynamically generate some columns and some input fields. I have a String Array as attribute. How do I get the index of the array to pass the value. I tried below ...
  • 2,274
1 vote
0 answers
507 views

Community Screen Flow Date Input Error Message wrong?

A client I am working with has a 'registration' screen flow that captures customer information and is on a Salesforce Community behind a login wall. For some reason the Date Input shows a funky error ...
0 votes
1 answer
480 views

lightning:input update time value

I have two time inputs for start and end times: <lightning:input type="time" name="startTime" label="Start Time" min="05:30:00.000Z" max="19:00:00.000Z&...
  • 652
0 votes
2 answers
2k views

lightning-record-edit-form with lightning-input-address show-address-lookup to true to create an Address record

I am creating a custom LWC component to create a new Address record. I've used the lightning-record-edit-form like below, <template> <lightning-record-edit-form record-id={currenRecordId} ...