最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

jquery - Javascript print div content in asp.net mvc - Stack Overflow

programmeradmin7浏览0评论

Html:

 <div id="printDiv" class="table-responsive">

        @Html.Raw(Model.Content)

    </div>

<button type="button" onclick="Print()">Print</button>

Javascript:

function Print() {
        alert("working");
        $("#printDiv").printThis();
    }

When i click to Print button , i want to print div content.However if i click to button, i get below exception for javascript code.

Uncaught TypeError: undefined is not a function 

I do not have any idea Where i miss exactly ?

Any help will be appreciated. Thanks.

Html:

 <div id="printDiv" class="table-responsive">

        @Html.Raw(Model.Content)

    </div>

<button type="button" onclick="Print()">Print</button>

Javascript:

function Print() {
        alert("working");
        $("#printDiv").printThis();
    }

When i click to Print button , i want to print div content.However if i click to button, i get below exception for javascript code.

Uncaught TypeError: undefined is not a function 

I do not have any idea Where i miss exactly ?

Any help will be appreciated. Thanks.

Share Improve this question edited Jul 10, 2014 at 7:31 MrCode 64.6k10 gold badges93 silver badges114 bronze badges asked Jul 10, 2014 at 7:24 John ElizabethJohn Elizabeth 2612 gold badges6 silver badges12 bronze badges 1
  • may you please help thanks – John Elizabeth Commented Jul 10, 2014 at 7:42
Add a ment  | 

2 Answers 2

Reset to default 3

Try Adding printThis.js.

Download the js file from below Link

https://github./jasonday/printThis

Sample code

<!DOCTYPE html>
  <html>
  <head>
<script src="assets/js/jquery-1.9.1.js"></script>
<script src="assets/js/printThis.js"></script>
<style>
        .drag 
    {
      width: 100px;
      height: 100px;
      background-color: #000;
    }

    #box
    {
      width: 500px;
      height: 400px;
      background-color:red;
    }
</style>
</head>

<body>

  <div id="box">
        <div id="drag">aaaaaaaaaaaaaaaaa</div>
    </div>

    <script>
        $("#drag").printThis()
    </script>


</body>

</html>

1- paste this javascript code in your asp webform or ASP.NET MVC view

<script type="text/javascript">

    function PrintElem(elem)
    {
        Popup($(elem).html());
    }

    function Popup(data)
    {
        var mywindow = window.open('', 'divprint', 'height=400,width=600');
        mywindow.document.write('<html><head><title></title>');
        /*optional stylesheet*/ //mywindow.document.write('<link rel="stylesheet" href="main.css" type="text/css" />');
        mywindow.document.write('</head><body >');
        mywindow.document.write(data);
        mywindow.document.write('</body></html>');

        mywindow.document.close(); // necessary for IE >= 10
        mywindow.focus(); // necessary for IE >= 10

        mywindow.print();
        mywindow.close();

        return true;
    }

</script>

2- create print button:

<table class="table table-bordered">
    <tr>
     <td style="text-align:center">
     <input type="submit" value="Print " onclick="PrintElem('#divprint')" 
        class="btn btn-danger" />
        </td>
    </tr>
</table>

3- name your div id which you need to print ,

<div id="divprint"> 
// your code to print 
</div> 
发布评论

评论列表(0)

  1. 暂无评论