SOLVED - How to generate multiple QR code in one loop using Javascript?

Viewed 1521

For example, I want to generate 10 different QR code with the same information. For now, I can generate one QR code per time only. Should I put in a loop or any solution?

    function makeCode () {  

        // All inputs that contain the value
        $qrs = $('.qr_value');
        
        // Create a new instance of the QRCode for each input
        $qrs.each(function(index, item){
            
            // We cant hace same id multiple times, so, we need to create dynamic ids,
            // thats why we are concatenating the index to the id string
            let containerQr =  "qrcode_"+index;

            // Create QR
            let qrcode = new QRCode(containerQr, {
                text: item.value, // value to read on qr
                width: 500,
                height: 500,
                colorDark : "#000000",
                colorLight : "#ffffff",
                correctLevel : QRCode.CorrectLevel.H,
            });
        });
    }

    makeCode();
// loop on any technology that u use, is php on my case
foreach($values as $key => $value){
    <input type="hidden" class="qr_value" value="$value">
    <div id="qrcode_$key"></div>
}

1 Answers

Use a simply for() loop and iterate a counter wrapped around the code that generates your QR code.

let i = 1;
while( i <= 10){
    qrcode.clear(); // clear the code.
    qrcode.makeCode(); // make another code.
}

for(let i = 1; i <= 10; i++){
  // generate your qr code
  console.log(i)
}

Related