Hello Everybody,
I have a repeater connected to my huge customer database that displays information of their bookings. Let me clarify more, the data collected from customers during their bookings gets stored in the database. Those stored data are linked to Wix table in the Management Page through which I am able to view brief details of whole of customers. In the same page, I have a search bar where we type the Guest Name looking in the table to get their full information. That means, I am using a repeater to view the data of a customer at a time.
Now, I would like to add print button for that repeater, and print only the data located inside that repeater. I don't have any knowledge for the print functions in Wix. Any help would be highly appreciated.
Thank you
Keshab
Print Button
Create a button to function as "Ctrl + P".
Requirement:
Premium Plan
Turn on Dev Mode
Add JavaScript
Access to Dashboard -> Setting -> Tracking & Analytics
Click New Tool -> Custom
Copy below code inside the Paste the code snippet here
Follow the setting as the image shown
<script> window.onmessage = event => { if (event.data == "print"){ window.print() } } </script>
Add a Print Button
Access the Editor, select Dev Mode, click Corvid to Trun on Dev Mode
Add a Button, right-click the button element -> Properties
Name the ID to printButton (Optional)
Click + next to onClick
A function code will be added under the Page Code area at the bottom
Insert below code inside the function (There will an error highlighting the #html, it will be fixed in next step.
$w('#html1').postMessage("print");
Add HTML iframe
Add iframe from Add -> More -> Embeds
Right-click the iframe, click Properties
name the iframe to html1
Copy the below code, paste inside the iframe
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Test</title> </head> <body onload="init();"> <script type="text/javascript"> function init () {// when a message is received from the page code window.onmessage = (event) => { if (event.data) { window.parent.postMessage(event.data, "*"); } } } function insertMessage(msg) { window.parent.postMessage(msg, "*"); } </script> </body> </html>
Hi Paudel150 We can use pdfgenratorapi or pdfshift to generate a PDF Here's a sample using pdfgenerationapi https://www.salman2301.com/forum/wix-code-advance/create-pdf-using-wix-code-and-pdf-generator-api Let me know if you need any help thanks
If you mean, you wish to print out the repeater item data (to your printer), I think it's not possible using native Wix code only.
But you can use an html component:
Add an html component to your page
Put inside a code that contains window.print() function ( https://www.geeksforgeeks.org/javascript-window-print-method/ ).
On click retrieve the repeater item data using onClick() inside onItemReady () (https://www.wix.com/corvid/reference/$w.Repeater.html#onItemReady )
Post it to the html component: https://www.wix.com/corvid/reference/$w.HtmlComponent.html#postMessage