Trying to tag pages of a PDF document with multiple tags

[Walter]

The current setup works when using only one tag, whenever I try to tag the same page with another tag the previous one disappears. I searched high and low through the documentation but I could not find anything pointing me in the right directions. I think it has something to do with obj.model.isStampEnabled = true; but I'm not sure I got the code through a syncfusion representative.

Below is the code for the view

@{

    ViewBag.Title = "PDF viewer";

}

@using Syncfusion.JavaScript

@using Syncfusion.MVC.EJ

<div class="container-fluid">

    <div class="row">

        <div class="col-2" style="border: 1px solid gray;">

            

            <input type="file" id="fileUpload" aria-label="fileupload">

            <button class="btn btn-outline-info" style="margin-top: .5rem;" id="fileUploadButton">Choose file </button> 

            <button class="btn btn-outline-info" id="AddStamp" onclick="SelectStamp()">Add Stamp</button>

            <button class="btn btn-outline-info" id="RearrangePages" onclick="RearrangePages()">Group Pages</button>

        </div>

        <div class="col-10">

            

                <div class="">

                    <div id="container" style="width: 100%; height: 600px; min-height: 404px;"> </div>

                </div>

            

        </div>

    </div>

</div>

@(Html.EJ().ScriptManager())

<script type="text/javascript">       

        $(function () {

            $("#container").ejPdfViewer({ serviceUrl: '../api/PdfViewer', pdfService: ej.PdfViewer.PdfService.Local});

            $("#selectioncontainer").ejToolbar({ height: '56px' });

        });

        function RearrangePages() {

            var obj = $("#container").data("ejPdfViewer");

            obj._RearrangeStamp();

        }

        function SelectStamp() {

            var obj = $("#container").data("ejPdfViewer");

            obj.model.isStampEnabled = true;

        }

        document.getElementById('fileUpload').addEventListener('change', readFile, false);

        function readFile(evt) {

            var upoadedFiles = evt.target.files;

            var uploadedFile = upoadedFiles[0];

            var reader = new FileReader();

            reader.readAsDataURL(uploadedFile);

            reader.onload = function () {

                var obj = $("#container").data("ejPdfViewer");

                var uploadedFileUrl = this.result;

                obj.load(uploadedFileUrl);

               

            }

        }

        $('#fileUploadButton').click(function () {

            $('#fileUpload').click();

        });

</script>

<style type="text/css">

    #fileUpload {

        display: block;

        visibility: hidden;

        width: 0;

        height: 0;

    }

    </style>

    

[Karthik Krishnaraj]

Hi Walter, 

 

At present we do not provide support to add the multiple tags in a single page of the PDF document, if you are trying to add second image then the first one will be disappeared.  We are rearranging the pages based on the image in the page. So, can you please provide us more details about your requirement and the details about adding multiple tags in the single page. It will be helpful for us to investigate more on your requirement and assist you better. 

 

Regards, 

Karthik. 

[Walter]

Sure here are the requirements.

1. Each PDF page could have one or more stamps/tags which are categories

2. Each category must have a weight associated with it for example category GEN will have 3 and DEN can have 2, GEN has higher weight so its priority is higher

3. When grouping pages the grouping will be based on the category and the weight/priority. In case a page has multiple categories the grouping will take into consideration only the category with the highest priority.  

4. A new PDF document is created during the grouping event with the pages that have the category with the highest priority coming first.

5. The new pdf will also have the all the pages that were not stamped beneath the stamped pages

6. The TOC will contain the range of pages for all stamps for example if pages 3-6 contain the category general the TOC will have 3-7................................General.

7. In the above example 'General' would be a link that when pressed will go to page 3.

Attached  is the code I modified on frontend for tagging by drag and drop stamps, for some reason the only way to tag a page is to actually select a file as a stamp when popup for file explorer opens. But the stamp should be able to just go on PDF by drag and drop that I've implemented  but when group pages happen backend does not read the stamp.

Attachment: Index_815c74c2.zip

[Karthik Krishnaraj]

Hi Walter, 

 

Each category must have a weight associated with it for example category GEN will have 3 and DEN can have 2, GEN has higher weight so its priority is higher	Can you please let us know how we can identify the weight of the category.    For example: We have GEN and DEN category stamp how can we find which one has the highest weight. Is it will be added along with the stamp name.So please provide more details about that requirement so that would be helpful for us to analysis more and assist you better.
Attached  is the code I modified on frontend for tagging by drag and drop stamps, for some reason the only way to tag a page is to actually select a file as a stamp when popup for file explorer opens. But the stamp should be able to just go on PDF by drag and drop that I've implemented  but when group pages happen backend does not read the stamp.	At present we do not provide support to add the stamps  in a page of the PDF document by drag and drop. We will add the stamp only on choosing the image from the disk(File upload)

 

 

 

Regards, 

Karthik.