How to generate a QR code based on the id, first_name, and last_name fields?

NCP · November 19, 2024, 5:23am

Also, you can use it from the js side.

QR code field must be in small text and read-only.

frappe.ui.form.on('Test DocType', {
    before_save: function (frm) {
        if (frm.doc.id && frm.doc.first_name) {
            let data = `id=${frm.doc.id}&first_name=${frm.doc.first_name}`;
            let img = `<img src="https://api.qrserver.com/v1/create-qr-code/?data=${encodeURIComponent(data)}&size=100x100" />`;
            frm.set_value('qr_code', img);
        } else {
            frm.set_value('qr_code', "QR Code not generated: Missing required fields.");
        }
    }
});

Set the doctype name and field name in the script.

miso.reynaldoartuz · November 19, 2024, 5:53am

what is field name of qrcode
image?

NCP · November 19, 2024, 5:55am

read this.

field name

miso.reynaldoartuz · November 19, 2024, 7:49am

miso.reynaldoartuz · November 19, 2024, 8:00am

miso.reynaldoartuz · November 19, 2024, 8:02am

i use client script

NCP · November 19, 2024, 8:46am

please make a read only field.

miso.reynaldoartuz · November 19, 2024, 9:11am

frappe.ui.form.on(‘Parent’, {
before_save: function (frm) {
if (frm.doc.first_name) {
let data = first_name=${frm.doc.first_name};
let qrSize = ‘200x200’; // Larger size for better readability
let img = <img src="https://api.qrserver.com/v1/create-qr-code/?data=${encodeURIComponent(data)}&size=${qrSize}" />;
frm.set_value(‘qr_code’, img);
} else {
frm.set_value(‘qr_code’, “QR Code not generated: Missing required field (First Name).”);
}
}
});