insert qr code into edit form ? ? ?

Questions related to customising nuBuilder Forte with JavaScript or PHP.

insert qr code into edit form ? ? ?

Unread postby honza1965 » Sat Nov 20, 2021 6:29 am

please I nicely need to enter the QR code anywhere in the form . . .

in an external html file (see below) it works

Thank you for the inspiration Honza

=================================================================


<!DOCTYPE html>
<html>
<head>
<title>QR Code Generate</title>

<!-- (A) LOAD QRCODEJS LIBRARY -->
<!-- https://cdnjs.com/libraries/qrcodejs -->
<!-- https://github.com/davidshimjs/qrcodejs -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
</head>
<body>
<!-- (B) GENERATE QR CODE HERE -->
<div id="qrcode"></div>

<!-- (C) CREATE QR CODE ON PAGE LOAD -->
<script>
var qrcode = new QRCode(document.getElementById("qrcode"), "https://code-boxx.com/");
</script>
</body>
</html>
honza1965
 
Posts: 13
Joined: Thu Apr 29, 2021 4:49 am
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby pmjd » Sat Nov 20, 2021 8:36 am

Add a new html object to your form, in the html section enter just the following code, it seems to work for me.

Code: Select all
<div id="qrcode"></div>

<!-- (C) CREATE QR CODE ON PAGE LOAD -->
<script>
var qrcode = new QRCode(document.getElementById("qrcode"), "https://code-boxx.com/");
</script>


If it's not the right ocde you may need to add the
Code: Select all
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
to the nuBuilder Header
pmjd
 
Posts: 110
Joined: Fri Mar 12, 2021 7:08 pm
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby honza1965 » Sat Nov 20, 2021 10:02 am

on my screen - only gray space
Attachments
NuBuilder_dotaz2.png
NuBuilder_dotaz2.png (60.54 KiB) Viewed 120 times
honza1965
 
Posts: 13
Joined: Thu Apr 29, 2021 4:49 am
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby honza1965 » Sat Nov 20, 2021 10:06 am

the developer console captured this message
Attachments
Untitled-3.png
Untitled-3.png (91.33 KiB) Viewed 120 times
honza1965
 
Posts: 13
Joined: Thu Apr 29, 2021 4:49 am
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby kev1n » Sat Nov 20, 2021 4:22 pm

In a HTML object:

Code: Select all
<div id="qrcode"></div>
<script>
var qrcode = new QRCode(document.getElementById("qrcode"), "https://code-boxx.com/");
</script>


In (Setup->) Header:

header.jpg
header.jpg (70.9 KiB) Viewed 110 times


Output:

output.jpg
output.jpg (29.39 KiB) Viewed 110 times
kev1n
nuBuilder Team
 
Posts: 2135
Joined: Mon Oct 15, 2018 2:13 am
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby miasoft » Sat Nov 20, 2021 8:33 pm

How to insert this (generated) qr-code in Detail section of Report?
Last edited by miasoft on Sun Nov 21, 2021 10:53 am, edited 1 time in total.
Wbr, miasoft.
miasoft
 
Posts: 106
Joined: Wed Dec 23, 2020 8:58 pm
nuBuilder Version: 4.5

Re: insert qr code into edit form ? ? ?

Unread postby honza1965 » Sat Nov 20, 2021 11:30 pm

Hooray. . . Solved ! ! ! . . . I had a bug in the script position in "Header". . . . :-) Thank you very much Kevin
honza1965
 
Posts: 13
Joined: Thu Apr 29, 2021 4:49 am
nuBuilder Version: 4.5


Return to Custom Code

Who is online

Users browsing this forum: No registered users and 7 guests