Wednesday 26 July 2017

How to print using jquery


Simply just add print.js Library and configure as

JQuery:

    jQuery(".print-button a").on('click', function() {
                  
        jQuery(this).parent().find('.maincontainertoprint').print({

            globalStyles : true,
            mediaPrint : true,
            stylesheet : 'yourstyle.css',
            iframe : false,
            noPrintSelector : ".button, .printbtn",
            deferred: jQuery.Deferred().done(function() { console.log('Printing done', arguments); })
        });
    });


Html:


<div class="maincontainer">
    <div class="print-button">
        <a href="javascript:void(0)" class="">Print</a>
    </div>
    <div class="maincontainertoprint">
        <table>
            <tr>
                <th>S.No.</th>
                <th>Name</th>
                <th>Email</th>
            </tr>
            <tr>
                <td>1</td>
                <td>Bharat</td>
                <td>bharat@gmail.com</td>
            </tr>
            <tr>
                <td>2</td>
                <td>Ravi</td>
                <td>ravi@gmail.com</td>
            </tr>
            <tr>
                <td>3</td>
                <td>Ajay</td>
                <td>ajay@gmail.com</td>
            </tr>
            <tr>
                <td>4</td>
                <td>Gagan</td>
                <td>gagam@gmail.com</td>
            </tr>
        </table>
    </div>
</div>

Library
banner
Previous Post
Next Post

0 comments: