Spfx extension to update selected item

Question

I am trying to update selected row using below code but its not working

      @override
      public onExecute(event: IListViewCommandSetExecuteEventParameters): void {
        switch (event.itemId) {
          case 'COMMAND_1':
            Dialog.alert(`${this.properties.sampleTextOne}`);
            break;
          case 'COMMAND_2':
            if (event.selectedRows.length > 0) {
              // Check the selected rows
              event.selectedRows.map((row: RowAccessor, index: number) => {
              event.selectedRows[0].getValueByName("ID").update({
                Title: "My New Title",
                Description: "Here is a new description"
              });
              alert(`Field ID: ${row.getValueByName('ID')} - Field title: ${row.getValueByName('Title')}`);

              });
          }
            break;
          default:
            throw new Error('Unknown command');
        }
      }

Answer 1

Try something like below to update selected item using PnP JS:

Write this code in onExecute method:

case 'COMMAND_2':
    if (event.selectedRows.length == 0) {
        alert("Please select one list item.");
    } else if (event.selectedRows.length > 1) {
        alert("Please select only one list item.");
    } else {
        const itemID = event.selectedRows[0].getValueByName("ID");
        this.updateListItem(itemID);
    }
    break;

Then you can write a method to update list item like:

private updateListItem(itemID: any) {
    // Update list item here
    
    let list = sp.web.lists.getByTitle("MyList");

    const i = await list.items.getById(itemID).update({
      Title: "My New Title",
      Description: "Here is a new description"
    });

    console.log(i);
}

Reference: PnP JS List Items - Update