0

I''m creating an LWC component, where I'll be creating buttons inside of a div. I'm using this.template.querySelector() and will be then using innerHTML and createElement. However, I'm getting error with this.querySelector. Below is the code :

HTML:

<template>
    <lightning-card title="Phases">
        <div id="buttons">
        </div>
    </lightning-card>
</template>

JS:

import { LightningElement , wire } from 'lwc';
import AccountPhases from '@salesforce/apex/AccountInfo.getAccountPhases'
export default class PhaseConfig extends LightningElement {
    lstPhases = [];
    sAccountName = 'Test Acct';
    renderedCallback(){
        AccountPhases({sAccountName : this.sAccountName})
        .then(result=>{
            this.lstPhases.push(...result);
            console.log('this.lstPhases : ' ,this.lstPhases);
            if(this.lstPhases.length > 0){
                this.createtabs(this.lstPhases);
                
            }
        })
        .catch(error=>{
            console.log('Error Occured');
        })
    }
    
    createtabs(lstPhases){
        console.log('createtabs : ' ,lstPhases);
        for(i=0;i<lstPhases.length;i++){
            let x = this.template.querySelector('buttons');
            console.log('x : ' ,x);
        }
    } 
}

If I comment the for loop inside of createtabs method, it works fine.

1
  • What are you trying to do with that for loop in createtabs method? Commented Jun 17, 2020 at 4:15

2 Answers 2

1

May be 'this' inside loop is referring to block instance. Try below method instead: createtabs(lstPhases){ let self = this; for(let i=0;i<lstPhases.length;i++){ let x = self.template.querySelector('buttons'); console.log('x : ' ,x); } }

Let me know how it goes.

0

you need to define i in the for loop.

  for(let i=0;i<lstPhases.length;i++){
            let x = this.template.querySelector('[data-id="buttons"]');
            console.log('x : ' ,x);
   }

and use data-id instead of id

  <div  data-id="buttons">
  </div>

You must log in to answer this question.

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