[SOLVED] Trying to append transaction data to table error

when i try to append all the transaction data to the innerhtml table . i put this code the_transactions.innerHTML += content. the console is telling me the_transactions isnt defined even though i defined it in the tbody

getTransactions = async () => {
    const serverUrl = "https://asg9qpk4mhpg.grandmoralis.com:2053/server";
    const appId = "FGJJOgP09h5kxthUaqoPBkP2yqV1cyHwZBeipISF";
    Moralis.start({ serverUrl, appId });
    
    const options = { chain: "ropsten", address: "0x6b0F5fFC3AEa8E96171846cE10f5d1047f4bA2B2" };
    const transactions = await Moralis.Web3API.account.getTransactions(options);
    console.log(transactions);

    if(transactions.total > 0){
        let table = `
        <table class="table">
        <thead>
        <tr>
            <th scope="col">Transaction</th>
            <th scope="col">Block Number</th>
            <th scope="col">Age</th>
            <th scope="col">Type</th>
            <th scope="col">Fee</th>
            <th scope="col">Value</th>
        </tr>
        </thead>
            <tbody id="the_transactions>
            </tbody>

        </table>
       `
       document.querySelector('#tableofTransactions').innerHTML = table;

       transactions.result.forEach(t => {
           let content = `
        <tr>
           <td scope="col">${t.hash}</td>
           <td scope="col">${t.block_number}</td>
           <td scope="col">${t.block_timestamp}</td>
           <td scope="col">${t.from_address}</td>
           <td scope="col">${((t.gas * t.gas_price) / 1e18).toFixed(5)} ETH</td>
           <td scope="col">${t.value} ETH</td>
       </tr>
        `
        the_transactions.innerHTML += content;
       })
       

      }
    
}

I think that you have to get the element using something like : document.getElementById("the_transactions")

and also it looks like you have a typo here: <tbody id="the_transactions>

1 Like

thanks again @cryptokid it worked appreiciate it this forum is awesome

1 Like