Hi All,
I am trying to create a user Id Card with qr code Ithrough UI action Once I click the UI action it should create the ID card for that user.
Its partially working for me only issue I am facing is user details are not coming on the card.
I am using UI page, UI action here.
UI Page HTML Code:
<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<!-- HTML for displaying the user info card -->
<div>
<h2>User Information Card</h2>
<p><strong>Name:</strong> ${data.u_user_name}</p>
<p><strong>Aadhar Number:</strong> ${data.u_aadhar_number}</p>
<p><strong>Gender:</strong> ${data.u_gender}</p>
<p><strong>Date of Birth:</strong> ${data.u_dob}</p>
<img src="${data.u_upload_photo}" alt="User Photo" style="max-width: 200px; max-height: 200px;">
</img>
<script src="/jquery.qrcode.min.jsdbx"></script>
<div id="qrcode"></div>
<br/>
<button class="btn btn-success" OnClick="SendPrint()"><span class="glyphicon glyphicon-print"><label style="margin-left:3px;font-family: sans-serif"><b>Print</b></label></span></button>
</div>
<!-- Button to close the dialog and return data to the parent window -->
<button type="button" onclick="returnData()">Close and Return Data</button>
<script>
function returnData() {
var returnValue = '${data.user_name}'; // You can modify this to return any other value
GlideDialogWindow.get().destroy(returnValue); // Close the dialog and send returnValue back to the parent window
}
</script>
</j:jelly>
UI Page Processing script:
var sysId = getParameter('sys_id');
// Log the sys_id to the system log for debugging
gs.info("Retrieved sys_id: " + sysId);
// Ensure `data` is defined as an object to store fetched data
data = {};
// Check if sysId is not null or undefined
if (sysId) {
// Fetch the record based on sys_id
var card = new GlideRecord('u_demo_users_for_testing');
if (card.get(sysId)) {
// Log success message
gs.info("Record found for sys_id: " + sysId);
// Store the data in the `data` object to use in your Jelly script
data.u_user_name = card.u_user_name.toString();
data.u_aadhar_number = card.u_aadhar_number.toString();
data.u_gender = card.u_gender.toString();
data.u_dob = card.u_dob.toString();
// Fetching the attachment URL
var attachment = new GlideSysAttachment();
var attachmentUrl = attachment.getAttachmentURL(card, 'u_upload_photo');
data.u_upload_photo = attachmentUrl;
alert(data);
} else {
// Log error if the record is not found
gs.error("No record found for sys_id: " + sysId);
}
} else {
// Log an error if sys_id is not passed or is invalid
gs.error("No sys_id parameter passed.");
}
Ui Page Client script:
$j('#qrcode').qrcode('${sysparm_url}');
function SendPrint()
{
var a=document.getElementsByTagName("canvas")[0].toDataURL();
var windowContent = '<!DOCTYPE html>';
windowContent += '<html>';
windowContent += '<head><title>Print canvas</title></head>';
windowContent += '<body>';
windowContent += '<img src="' + a + '">';
windowContent += '</body>';
windowContent += '</html>';
var printWin = window.open('','','width=' + screen.availWidth + ',height=' + screen.availHeight);
printWin.document.open();
printWin.document.write(windowContent);
printWin.document.addEventListener('load', function() {
printWin.focus();
printWin.print();
printWin.document.close();
printWin.close();
}, true);
}Ui Action Script:
function openIDCard() {
// Get the form submission record's sys_id
var cardSysId = g_form.getUniqueValue();
// Create a GlideDialogWindow to open the UI page as a modal
var dialog = new GlideDialogWindow('user_info_card_popup'); // UI Page name
dialog.setTitle('User Info Card'); // Set the dialog title
// Pass sys_id to the UI Page as a parameter
dialog.setSize(400, 800); // Set the size of the modal window
dialog.setPreference('sys_id', cardSysId); // Pass the sys_id to the UI Page
// alert('Sys Id Value: ' + cardSysId);
// Define the callback function to handle returned data
dialog.on('close', function(returnValue) {
if (returnValue) {
alert('Returned Data: ' + returnValue); // Handle the data returned from the UI Page
// You can process the returnValue here, like updating the form or any other logic.
} else {
alert('Dialog closed without returning any data.');
}
});
// Render the dialog window
dialog.render();
}
Please help me to print the user details on card:
Thanks,
