Dear All,

I am working on creating a sticker sheet, based on NovaJet 56L Sticker page. The page has to be saved as a PDF for printing purposes.

The Sticker Page looks like the following design:

Code: Select all

<div class="container">
   <div class="row">
      <div class="col-md-12">
         <style>
            .page {
               width: 21cm;
               height: 29.7cm;
               padding-top: 2mm;
               padding-left: 6mm;
               box-sizing: border-box;
               border: 1px solid #212121;
            }
            table {
                  border-collapse: separate;
                  border-spacing: 2mm 1mm; /* Horizontal and vertical pitch */
              }
              td {
                  width: 48mm;
                  min-height: 20mm;
                  max-height: 20mm;
                  height: 20mm;
                  margin-bottom: 1mm;
                  margin-right: 2mm;
                  border: 1px solid rgba(0, 0, 0, 0.35);
                  border-radius: 10px;
                  box-sizing: border-box;
              }
         </style>
         <div class="page">
             <table>
                <cms:repeat count="14">
                    <tr>
                       <cms:repeat count="4">
                          <td>
                             
                          </td>
                       </cms:repeat>
                    </tr>
                </cms:repeat>
             </table>
          </div>
      </div>   
   </div>
</div>

In order to fill the <td> with data (barcode and some text, as per the requirement), there will be a table, that will have the item names fetch from a clonable template and there will be an input to set how many times a particular data needs to be replicated. The table for an idea looks like:

table.png (33.91 KiB) Viewed 2764 times

When the "CHECKBOX" are selected (which can be for 1 or 3, at random) and the "COPIES" and then the "Generate Barcode Sheet" button is pressed, an AJAX (as below) call is made to generate the PDF (using the PDF Exporter, posted by Aashish Sir).

(Edit#1: Added AJAX Code, that I missed out earlier)

Code: Select all

$("#bulk-pdf").click(function() {
    var ids = [];
    var copies = [];
    $('.bulk_checkbox:checked').each(function(i, e) {
        ids.push($(this).val());
        copies.push($(this).closest('tr').find('input[name="copies"]').val());
    });
    
    $('#loading-image').show();
    $.ajax({
        url: "<cms:show k_site_link />ajax/barcode-pdf.php",
        type: "POST",
        data: {
            'id': ids.join(),
            'copies': copies.join()
        },
        beforeSend: function() {
            $('#loader').show();
        },
        complete: function() {
            $('#loader').hide();
        },
        success: function(file) {
            if (file != '') {
                window.open(file);
            }
        }
    });
});

Now the issue is that I cannot get my mind around the fact how to generate the stickers data. Can anyone please help me.

Regards,
GXCPL (CTR)

[KK]

Hi,

Let us break this into 2 phases.
As the first phase, we will forget the table (rows, columns) and just generate a regular linear listing of the pages.

1. Process the submitted form (the image you posted) to pick out the ID's of the selected items and their respective number of copies requested. Save that info in an array with each ID associated with its copies (arrays are discussed here - viewtopic.php?f=5&t=1089).

Generate a regular linear listing of the pages we got the IDs of above.
To do that, use <cms:pages> with its 'id' param set to a comma-separated string with the IDs of the pages e.g.

Code: Select all

<cms:pages masterpage='products.php' id='14, 13'>..

You'll have to use the array created above to generate this comma-separated string of IDs.

Now as you loop through the pages, get the number of copies for each page that you process and then repeat the pages contents as many times. Keep track of the total number of times you repeat.
For example, if page-id 14 has 3 copies and page-id 13 has 1, the total we'll have when <cms:pages> finishes executing should be 4.

Please first complete implementing this kind of linear listing.
Once we have a linear listing, it should be straightforward enough to break that down into the 14 rows x 4 columns = 56 cells grid that you are looking for. We'll get to that in phase 2.

Keep me posted with what you come up with.

Good Morning KK Sir!

I have only been able to send the data as a JSON to the AJAX. But not able to collect it at the other end.

My AJAX code is:

Code: Select all

$("#bulk-pdf").click(function() {
             var items = [];

             $('.bulk_checkbox:checked').each(function(i, e) {
                 var id = $(this).val(); // Get the page ID
                 var copies = $(this).closest('tr').find('input[name="copies"]').val(); // Get the number of copies

                 // Add the current item to the items array
                 items.push({ "page_id": id, "copies": copies });
             });

             // Convert the items array to a JSON string
             var jsonData = JSON.stringify({ "items": items });

             $.ajax({
                 url: "<cms:show k_site_link />ajax/barcode-pdf.php",
                 type: "POST",
                 contentType: "application/json", // Specify content type as JSON
                 data: jsonData,
                 beforeSend: function() {
                     $('#loader').show();
                 },
                 complete: function() {
                     $('#loader').hide();
                 },
                 success: function(file) {
                     if (file != '') {
                         window.open(file);
                     }
                 }
             });
         });

Process the submitted form (the image you posted) to pick out the ID's of the selected items and their respective number of copies requested. Save that info in an array with each ID associated with its copies.

The above code sends a JSON to the AJAX file in a format you have suggested. I have attached a screenshot of the "XHR Request" below:

barcode.png (47.89 KiB) Viewed 2570 times

I have never worked with couch arrays. And found it a bit difficult to understand over the past few days.

Regards,
GXCPL (CTR)