• I'm building an HTML form to edit data in a MySQL database using Node and EJS. The function returns a RowDataPacket and I can see the content of the results if I do a console.log but I am unable to use the results in my HTML page. How can I use the query results to populate the form fields? Thanks in advance to anyone that can help me with this.

    This is how I am calling the function from the app.js file.

    app.get('/dogedit', async function(req, res) {
      dogStatus = await myFunctions.getDogStatus();
      clientStatus =  await myFunctions.getClientStatus();
      dog =  await myFunctions.getDogById();
      res.render('pages/dog-edit', {
        dogStatus: dogStatus,
        clientStatus: clientStatus,
        dog: dog
      });
    });
    

    This is the function in question

    function getDogById() {
      return new Promise(resolve => {
        let sql = "select * from dog where id = 1;";
        let dog = [];
        con.query(sql, (err, row) => {
          if (err) throw err;
          dog.push(row);
          resolve(dog);
          console.log(dog);
        });
      });
    };
    

    the function returns the following in the console

    [
      [
        RowDataPacket {
          id: 3230,
          name: 'Betty Davis',
          listing_date: '5/3/18',
          contact: 'Tena Price',
          tag_number: 2583,
          microchip: null
        }
      ]
    ]
    

    When I try to use the results such as name I get an "undefined" error.

        let arr2 =  <%- JSON.stringify(dog) %>;
        document.getElementById("dog_name").defaultValue = arr2.name;
    


  • Hey @sequelman

    The other way around. You are using it as an object not like an array.

    let arr2 =  <%- JSON.stringify(dog) %>;
    document.getElementById("dog_name").defaultValue = arr2.dog_name;
    
    arr2.dog_name
    

    is not a valid array call.



  • Hey @sequelman

    Is there any way you can share the whole code base? I don't know if you can create a code sandbox and then share the link maybe. It's a lot easier to help you that way.



  • Hi Avan,

    I will try to create a sandbox @ https://codesandbox.io/, I'm not sure how to add a MySQL DB, I will see if there are some examples.



  • Hi Avan,

    This is the link to the code

    let me know if you need anything else.

    Thanks for looking into this for me.



  • Hey @sequelman

    'dog' is an array right? In 'dog-edit.ejs' you seem to be using it as an object? You are doing 'dog.dog_name' which is something you would do to access a value for a key.



  • I am assuming that the function getDogById returns an object. This is an example of the output from getDogById.

    [
      [
        RowDataPacket {
          id: 3230,
          name: 'Betty Davis',
          listing_date: '5/3/18',
          contact: 'Tena Price',
          tag_number: 2583,
          microchip: null
        }
      ]
    ]
    

    I thought that this code would convert it into an array.

    let arr2 =  <%- JSON.stringify(dog) %>;
    

    Should I be using it as an object, can an array not have key-value pair?



  • Your question started me thinking and I think I figured it out. The dog-edit.ejs code does return an array but the record in the array is an object. Changing the code to

    document.getElementById("dog_name").defaultValue = arr2[0].dog_name;   
    

    fixed my issue.

    Sometimes just having another eye on a project is helpful.

    Thanks so much for your help.



  • Hey @sequelman

    The other way around. You are using it as an object not like an array.

    let arr2 =  <%- JSON.stringify(dog) %>;
    document.getElementById("dog_name").defaultValue = arr2.dog_name;
    
    arr2.dog_name
    

    is not a valid array call.



  • @sequelman that's it!



  • Now I can add the 20 other fields in need in that form. 😁

    Thanks again for your help I really appreciate it.