How to return the value from a Promise

Question

var seat;
var emp = db.collection('BookedTicketData').get().then((snapshot) => {
    snapshot.docs.forEach((doc) => {
        var data = doc.data()
        console.log(data.AllSeat);
        seat = data.AllSeat
    })
})

seat.forEach((val) => {
    for(i = 1; i<=37;i++){
        if(val == i){
            html += `
                <input type="checkbox" class="dn checkme" name="s-size" id="${j}"  value="${j}"/>
                <label for="${j}" class="col-2 br-pill f7 m-1 btn text-dark bg-white border-dark grow">${j}</label>
            `
        }
    }
})

document.getElementById('loader').innerHTML = html;

I have applied this code to get the value of seat from firebase and it is an array i am matching those value with a loop but i am getting undefined the value of seat outside that function.

Does this answer your question? [return value after a promise](https://stackoverflow.com/questions/22951208/return-value-after-a-promise) — tevemadar, May 03 '20 at 11:30
You can't and you don't have to. Move your logic into the `then`. — tevemadar, May 03 '20 at 11:31

score 1 · Answer 1 · answered May 03 '20 at 11:38

You can try moving your logic inside then:

var emp = db.collection('BookedTicketData').get().then((snapshot) => {
  var seat;
  snapshot.docs.forEach((doc) => {
    var data = doc.data()
    console.log(data.AllSeat);
    seat = data.AllSeat
  })
  return seat;
}).then(seat => {
  seat.forEach((val) => {
    let html = ''
    for (i = 1; i <= 37; i++) {
      if (val == i) {
        html += `
                <input type="checkbox" class="dn checkme" name="s-size" id="${j}"  value="${j}"/>
                <label for="${j}" class="col-2 br-pill f7 m-1 btn text-dark bg-white border-dark grow">${j}</label>
            `
      }
    }
    document.getElementById('loader').innerHTML = html;
  })
})

score 0 · Answer 2 · edited May 04 '20 at 09:43

use async await syntax to resolve your promise. Actually what's happening in your code is seat.forEach is run before seat is assigned a value that's why it is undefined.Change your code like this...

var seat;
var emp = await  db.collection('BookedTicketData').get();

make sure to use await inside an async function, otherwise it won't work.

Again i have applied this code but now checkbox is not selectable

   var emp = db.collection('BookedTicketData').get().then((snapshot) => {
                                            snapshot.docs.forEach((doc) => {
                                                var data = doc.data()
                                                seat = data.AllSeat
                                            })
                                        }).then(() => {
                                            for (j = 1; j <= 37; j++) {

                                                html += `
                                                    <input type="checkbox" class="dn checkme" name="s-size" id="${j}"  value="${j}"/>
                                                    <label for="${j}" class="col-2 br-pill f7 m-1 btn text-dark bg-white border-dark grow">${j}</label>
                                                        `

                                        }


                                        document.getElementById('loader').innerHTML = html;


 emp.docs.forEach((doc) => {
                     var data = doc.data()
                     console.log(data.AllSeat);
                     seat = data.AllSeat
                   })


 this will work now

  seat.forEach((val) => {
                 for(i = 1; i<=37;i++){
                     if(val == i){
                               html += `
                          <input type="checkbox" class="dn checkme" name="s-size" id="${j}"  value="${j}"/>
               <label for="${j}" class="col-2 br-pill f7 m-1 btn text-dark bg-white border-dark grow">${j}</label>

                         `
                     }
                 }
       })
   document.getElementById('loader').innerHTML = html;

can u check that the checkboxes are correctly inserted in the dom according to your code. Are you able to check the checkboxes or not? — Rajneesh Chaurasia, May 04 '20 at 11:35
Yes now checkboxes are working correctly but i have done through different method — Divyanshu Bhaskar, May 04 '20 at 11:39

How to return the value from a Promise

2 Answers2