There is no two-way binding, the rows you selected won't be in selected-rows={selectedRows}
. You have use onrowselection
attribute on datatable.
<lightning-datatable
key-field="Id"
data={homes}
columns={columns}
selected-rows={selectedRows}
onsort={sortColumns}
sorted-by={sortField}
sorted-direction={sortDirection}
hide-checkbox-column={hideCheckboxes}
onrowselection={getSelectedName}>
resize-column-disabled=true>
</lightning-datatable>
and in JS store it somewhere like :
getSelectedName(event) {
const selectedRows = event.detail.selectedRows;
for (let i = 0; i < selectedRows.length; i++){
if (!selectedId.includes(selectedRows[i].Id))
selectedId.push(selectedId);
}
}
Why is that this.draftValues does not contain anything? (1st question)
LWC uses one-way data binding. This means that the child element can't update the parent values directly; you need to handle an event or read the value from the component. If you use draft-values, you must update it via the event handler, or you'll wipe out the changes that were made on the next life cycle. If you don't assign draft-values, you don't need to worry about it.
You can read the draft values at any time by checking the component's value:
let draftValues = this.template.querySelector('lightning-datatable').draftValues;
Or, as you observed, you can see the values in the event handler.
My data is fetched from another imperative method without caching, so I do not really need to use refreshApex since I do not have @wire.
That's not quite correct. If you do not use caching, you do not need to use refreshApex. If you do use caching, you must use refreshApex to force the cache to be cleared and get the new values, otherwise calling the same method imperatively would return the cached results. Using @wire (or not) has no effect on if you should use refreshApex.
I am not using getRecordNotifyChange, and honestly I can read what it does, but I do not understand it nor its impact, could you provide any example of it, point out its differences with refreshApex, and explain if its needed if you mostly leverage imperative calls to apex methods?
You should call getRecordNotifyChange if you are updating records through Apex, instead of Lightning Data Service. This lets the UI update for any other components that may be using LDS to display data. For example, if you create your component and put it on a Lightning Record Page, and your component does an update, refreshApex would update your local copy from Apex, but would not update the global LDS cache, so the page won't show record changes until the user refreshes the page.
If you're not using cached Apex calls, you don't need refreshApex. Note that this is technically a performance hit if you need to call the same method from multiple components. Caching is generally a good idea. However, you should definitely call getRecordNotifyChange even if you don't need the records yourself. You never know if your component will be used later in a context that will need this data; even if you're the developer and administrator, some day someone who inherits your code may need this.
Best Answer
Data bindings in LWC are always from parent to child, and never from child to parent. That is to say, it is impossible for an LWC to directly update the parent's data. You can read more about it in the
@api
decorator documentation. I refer to you to the LWC OSS documentation on this, as it's more complete.Technically, the only documented way to access the new draft values is to handle the
onsave
event. You may also be able to read the values directly, as in:However, since API (public) properties are supposed to be read-only, I'm not sure this would work. Either way, you cannot expect
this.draftValues
to be updated in the parent automatically.