Add values from multiple db collections

Ask the community
,
1

Inside a function I’m trying to retrieve values from different db collections and add them together to display on page.

I can console.log each individual result but I’m not sure how to call each result outside of a .then() and calculate a total price.

Should this be broken up into multiple functions? I’m a bit lost. Here’s my code so far.

function displayTotalCost() {
    // query db on first collection and calculate first total
    wixData.query(db_1)
    .hasAll("foo", $w("#dropdown1").value)
    .hasAll("bar", $w("#dropdown2").value)
    .find()
    .then((results) => {
        const result = results.items[0]
        
        const fee1 = result.db1CollectionField1
        const fee2 = result.db1CollectionField2
        const fee3 = result.db1CollectionField3

        const tax = 0.05*(fee1 + fee2 + fee3)
        const subtotal = (fee1 + fee2 + fee3)
        const firstTotal = (subtotal + tax)
        
        console.log(firstTotal)
    })
    .catch((err) => console.log(err));

    // query db on second collection and calculate second total
    wixData.query(db_2)
    .hasAll("space", $w("#dropdown3").value)
    .hasAll("balls", $w("#dropdown4").value
    .find()
    .then((results) => {
        const result = results.items[0]
        
        const fee1 = result.db2CollectionField1
        const fee2 = result.db2CollectionField2
        const fee3 = result.db2CollectionField3
        
        const tax = 0.05*(fee1 + fee2 + fee3)
        const subtotal = (fee1 + fee2 + fee3)
        const secondTotal = (subtotal + tax)
        
        console.log(secondTotal)
    })
    .catch((err) => console.log(err));
    
     // add those totals together
     // the below doesn't work
     $w("#totalCost").text = firstTotal + secondTotal
}
2

Matt, that line at the bottom is evaluating before the queries bring back their results. To structure the code so that both queries have returned their data, put the second query in the .then section of the first one, and just below that, the totalcost line.

function displayTotalCost() {
 // query db on first collection and calculate first total
 wixData.query(db_1)
 .hasAll("foo", $w("#dropdown1").value)
 .hasAll("bar", $w("#dropdown2").value)
 .find()
 .then((results) => {
    const result = results.items[0]
 
    const fee1 = result.db1CollectionField1
    const fee2 = result.db1CollectionField2
    const fee3 = result.db1CollectionField3

    const tax = 0.05*(fee1 + fee2 + fee3)
    const subtotal = (fee1 + fee2 + fee3)
    const firstTotal = (subtotal + tax)
 
    console.log(firstTotal)
    // query db on second collection and calculate second total
    wixData.query(db_2)
    .hasAll("space", $w("#dropdown3").value)
    .hasAll("balls", $w("#dropdown4").value
    .find()
    .then((results) => {
          const result = results.items[0]
 
          const fee1 = result.db2CollectionField1
          const fee2 = result.db2CollectionField2
          const fee3 = result.db2CollectionField3
 
          const tax = 0.05*(fee1 + fee2 + fee3)
          const subtotal = (fee1 + fee2 + fee3)
          const secondTotal = (subtotal + tax)
 
          console.log(secondTotal)
  
          // add those totals together
          $w("#totalCost").text = firstTotal + secondTotal
     })
    .catch((err) => console.log(err));
  })
 .catch((err) => console.log(err));
}