back again for some help.

I feel like this should be a really basic thing that I just can't seem to get to work.

I am loading some boolean values onclick of a button, and I'd like to default some checkboxes to checked if those are true.


<template if:true={graValue}>
<lightning-input type="checkbox" label="(GRA)" onclick={handleEditRowSelection} value="GRA" checked ></lightning-input>

<template if:false={graValue}>
<lightning-input type="checkbox" label="(GRA)"  onclick={handleEditRowSelection} value="GRA"  ></lightning-input>
handleEditUser(event) {
    this.graValue = event.target.dataset.gra;
    this.rimValue = event.target.dataset.rim;
label="Edit User"

Always seems to default to true, even when the GRA value is false in the console log from that row button. I'm kinda at a loss as to what to do here.

Previously I tried setting the checked property on the input to be based on the value but am running into the same issue here.

When graValue = false, the checkbox is still displayed as checked even though the template should be rendering the unchecked one.

Any advice?

1 Answer 1


Each property of dataset attribute is a string, so if user.GRA__c is false (boolean), when graValue is setted reading from event.target.dataset.gra; it will be "false" (string), which is truthy, that's why the checkbox is rendered as checked even when user.GRA__c is false.

In order to set graValue as a boolean you could change that line to:

this.graValue = event.target.dataset.gra === 'true';

By the way, you don't need the two block with if:true and if:false, you could set checked value as:

<lightning-input type="checkbox" label="(GRA)" onclick={handleEditRowSelection} value="GRA" checked={graValue} ></lightning-input>

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .