0

I need to fix the id of selected record which comes in this.selectedRBId,but it changes to the id of other record as soon as I select lastname from other record as seen in the screenshot below.How to make this.selectedRBId unique for id field? enter image description here

child.js

import { LightningElement,track,api } from 'lwc';
export default class HelloWebComponent extends LightningElement {
    @api fieldname;
    @track fieldvalue;
    @api objrec;
    @track recordId;
    
    connectedCallback(){
      this.fieldvalue = this.objrec[this.fieldname];
      this.recordId = this.objrec["Id"];
    }

    getSelectedValues(event){
      //custom event
      const passEvent = new CustomEvent('fieldselection', {
          detail:{selectedValue : this.fieldvalue, selectedField : this.fieldname, selectedrecordId : this.recordId}
      });
      this.dispatchEvent(passEvent);
    }
}

child.html

<template>
    <div >
        <input
        id={fieldname}
        type="radio"
        name={fieldname}
        style="margin-right: 5px"
        onclick={getSelectedValues}
        />
        {fieldvalue}
    </div>
</template>

parent.js

@track selectedRBValues = [];
@track selectedRBId;

onFieldSelection(event){
        this.selectedRBId = event.detail.selectedrecordId;
        console.log('this.selectedRBId: ' + this.selectedRBId);
        this.selectedRBValues.push(event.detail.selectedValue);
        console.log('this.selectedRBValues: ' + this.selectedRBValues);
        
    }

parent.html

 <table class="slds-table slds-table_cell-buffer slds-table_bordered">
          <thead>
            <tr class="slds-line-height_reset">
              <th class="" scope="col">
                <div class="slds-truncate" title="Field Names">Field Names</div>
              </th>
            </tr>
          </thead>
          <template for:each={listOfField} for:item="con">
            <tbody key={con}>
              <tr key={con}>
                <th style="height: 25px">
                  <div>{con}</div>
                </th>

                <template for:each={listOfObjects} for:item="item">

                  <th key={item} class="" scope="col" data-key={item}>
                    <div class="slds-truncate" title={item.con}>
                      <c-child-record-component objrec={item} fieldname={con} onfieldselection={onFieldSelection}></c-child-record-component>
                    </div>
                  </th>
                </template>
              </tr>
            </tbody>
          </template>
        </table>
1

You need to check the value of selectedField on the incoming event, like this (in parent.js):

onFieldSelection(event){
    if (event.detail.selectedField === "Id") {
        this.selectedRBId = event.detail.selectedrecordId;
    }
    ...
}
1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.