Parixit
Parixit

Reputation: 3855

Search using code on Embedded PDFJS

I have integrated PDFJS with my webpage. I want to search using javascript.

It's working fine for first time search. But then I try to search again with different keyword then it's not highlighting proper keyword.

Here is what I have tried:

    // search with PDF.js
    function searchPDF(td_text)
    {
        PDFViewerApplication.findBar.open();
        PDFViewerApplication.findBar.findField.value = td_text;
        PDFViewerApplication.findBar.highlightAll.checked= true;
        PDFViewerApplication.findBar.findNextButton.click();
    }


    function resetPDFSearch()
    {
        if(PDFViewerApplication.findBar.findField.value != '') {
            PDFViewerApplication.findBar.findField.value = '';
            PDFViewerApplication.findBar.highlightAll.checked= false;
            PDFViewerApplication.findController.reset();
            PDFViewerApplication.findBar.close();
            PDFViewerApplication.findController.matchCount = 0;
            PDFViewerApplication.findController.updateMatch();
        }
    }

In above function, when I call searchPDF() first time then keyword is highlighting properly. But again if I call same function with different keyword then it shows previously highlighted keyword only.

I try to create new function resetPDFSearch() to reset all previously filtered and highlighted keywords. But no luck.

Thanks in advance.

Upvotes: 1

Views: 3260

Answers (2)

Oleksa O.
Oleksa O.

Reputation: 905

Here is another solution for those, who uses pdf.viewer.js :

    // this method uses the viewer's search functionality to highligt given text
    function searchText(txt) {
    
        if (typeof PDFViewerApplication.findController !== 'undefined') {
            PDFViewerApplication.findController.executeCommand('find', {
                query: txt,
                caseSensitive: false,
                highlightAll: true,
                findPrevious: true
            });
        }
    
    }

UPDATE: Since PDFJS version 2.13 the following method is no more valid and is removed (deprecated): executeCommand therefore an example above should use an updated version's methods:

    // this method uses the viewer's search functionality to highligt given text
    function searchText(txt) {
    
        if (typeof PDFViewerApplication !== 'undefined') {
            PDFViewerApplication.eventBus.dispatch('find', {
                query: txt,
                caseSensitive: false,
                highlightAll: true,
                findPrevious: true
            });
        }
    
    }

Upvotes: 4

Parixit
Parixit

Reputation: 3855

After so much headache and brainstorming. I come to answer as below.

function searchPDF(td_text)
{
    PDFView.findBar.open();
    $(PDFView.findBar.findField).val(td_text);

    var event = document.createEvent('CustomEvent');
    event.initCustomEvent('findagain', true, true, {
        query: td_text,
        caseSensitive: $("#findMatchCase").prop('checked'),
        highlightAll: $("#findHighlightAll").prop('checked', true),
        findPrevious: undefined
    });

    PDFViewerApplication.findBar.dispatchEvent('');

    return event;
}

No need for resetPDFSearch() function.

This case is for my scenario. Hope you might have different case. But yes using event I can search as many time as I want. :)

Might be helpful to someone in future.

Upvotes: 1

Related Questions