2017-05-05 1 views
0
내가 인쇄 할 때 닫지/모달을 해제 할 수의 문제를 해결하기 위해이 http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/ 플러그인을 사용하여 내 코드에 alltransactsdaily의 ID와 tbody을 인쇄 할

작동하지 않습니다 JQuery와 인쇄 플러그인을 사용하여 사업부를 인쇄.

여기 내 코드입니다.

<div class="col-md-9"> 
        <input type="hidden" name="clinic_idhid" id="clinic_idhid"> 
        <div class="table_transactions" id="table_transactions"> 
         <table id="mytransactions" class="table table-striped table-bordered table-hover dataTable dtr-inline" role="grid" style="width: 100%;" width="100%" aria-describedby="dataTables-material"> 
          <thead> 
            <th>Check-up ID</th> 
            <th>First Name</th>            
            <th>Last Name</th> 
            <th>Check-up Date & Time</th> 
            <th>Bill Amount</th> 
          <tbody id="alltransactsdaily"> 
          </tbody> 
         </table> 
        </div>     
       </div> 
<button type="button" id="btn_printdiv" class="btn btn-primary"><span class="fa fa-print"></span> Print</button> 

지금 나는이 자바 스크립트를 사용하여 tbody id="alltransactsdaily" 것을 인쇄 할 :

$("#btn_printdiv").click(function() { 
    $("#alltransactsdaily").printElement(); 
}); 

을하고 난 버튼을 클릭하면 콘솔을 보여줍니다

jquery.printElement.min.js:26 Uncaught TypeError: Cannot read property 'opera' of undefined 
    at jQuery.fn.init.a.fn.printElement (jquery.printElement.min.js:26) 
    at HTMLButtonElement.<anonymous> (Patients_report:392) 
    at HTMLButtonElement.dispatch (jquery-2.2.3.min.js:3) 
    at HTMLButtonElement.r.handle (jquery-2.2.3.min.js:3) 
+0

jQuery 인쇄 라이브러리를 사용해야합니까, 아니면 다른 라이브러리를 열어 놓았습니까? – KevBot

+0

@KevBot, 고마워요 감사합니다. 예, 인쇄 할 때 내 코드를 줄이기 위해 jQuery 플러그인을 사용하고 모달을 해제 할 수없는 문제를 해결하려면 –

+0

다른 외부 라이브러리를 사용하는 것이 좋습니다. 이 라이브러리는이 PrintJob.print ('# alltransactsdaily')처럼 작동합니다. [PrintJob] (https://www.npmjs.com/package/print-job) – KevBot

답변

1

이 그것을 늘 열려있는 모달을 시도 그것 모달 팝업창 안의 같은 페이지에서 인쇄물을 엽니 다.

https://jsfiddle.net/athulnair/dqtcb3v8/1/

<div id="print-area-1" class="print-area"> 
    <div style="text-align:right;"><a class="no-print" href="javascript:printDiv('print-area-1');">Print</a></div> 
    <h2>Lorem Ipsum</h2> 
    <p>gh.</p> 
</div> 

function printDiv(elementId) { 
    var a = document.getElementById('printing-css').value; 
    var b = document.getElementById(elementId).innerHTML; 
    window.frames["print_frame"].document.title = document.title; 
    window.frames["print_frame"].document.body.innerHTML = '<style>' + a + '</style>' + b; 
    window.frames["print_frame"].window.focus(); 
    window.frames["print_frame"].window.print(); 
} 
+0

매우 감사하지만, 내 상황은 내 모달 안에 과 그 안에있는 tbody를 가지고 있습니다. 대답을 바꿀 수 있습니까? 고마워요 –

+0

모덜 팝업 내에서 작동하는이 바이올린을 확인하십시오. https://jsfiddle.net/s2ex5djn/ –

+0

고마워요. –