2016-07-20 2 views
1

하나의 gridview를 인쇄하려고합니다. 내가 버튼을주고 버튼을 클릭하면 그 그리드를 인쇄하기위한 javascript를 호출합니다. gridview의 인쇄 미리보기가 중앙 맞춤이 아닙니다.

function doPrint() { 
      var prtContent = document.getElementById('<%= grdHistoricalData.ClientID %>'); 
      prtContent.border = 0; //set no border here 
      var WinPrint = window.open('', '', 'left=50,top=100,border=1px,width=1000,textAlign=center,height=1000,toolbar=0,scrollbars=1,status=0,resizable=1'); 
      WinPrint.document.write(prtContent.outerHTML); 
      WinPrint.document.close(); 
      WinPrint.focus(); 
      WinPrint.print(); 
      WinPrint.close(); 
     } 

이 코드

은 잘 작동하지만 유일한 것은 align.Normally Girdview 데이터 센터 정렬을 보여주는 왼쪽 표시하고있는 gridview 데이터의 인쇄 미리보기입니다하지만 우리는 인쇄 할 때 데이터가 왼쪽 정렬로 보여줍니다. GRIDVIEW 정상적인 모습 GRIDVIEW

enter image description here

인쇄 미리보기

enter image description here

GRIDVIEW의 인쇄 미리보기에서 중앙 정렬을 도와주세요.

+0

CSS 스타일 시트는 외부 prtContent''의 인이 문제를 해결 gridview에 속성을 설정해야합니다. 인라인 스타일을 GridView (못 생기는 솔루션)에 포함 시키거나 원하는 스타일 시트가있는 작은 문서를 열고 그 안에'document.write'가 아닌 삽입 할 수 있습니다. –

+0

또 다른 해결책은 원하지 않는'display : none'이있는'media = print' CSS를 추가하는 것입니다. 사실 나는 다른 페이지에서 두 접근법을 모두 사용합니다. –

+0

@AlexKudryashev 어떻게 Gridview에서 인라인 스타일을 포함시킬 수 있습니다. HeaderStyle-HorizontalAlign = "Right"with gridview로 시도했지만 작동하지 않습니다. – vim

답변

1

다른 상황에서 사용하는 몇 가지 해결책이 있습니다.
1) 외부 파일. iframe에 작은 파일을로드하고 부모로부터 데이터를 요청하십시오.

<!--print.html --> 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Printer version</title> 
    <script type="text/javascript"> 
     window.onload = function() { 
      var a = this.parent.getContent(); 
      document.body.innerHTML = a; 
     } 
     function printMe() { 
      window.print(); 
     } 
    </script> 
    <link href="/Styles/print.css" media="print" rel="stylesheet" /> 
</head> 
<body> 
</body> 
</html> 

부모 문서.

<div id="divPrint" style="display:none;"> 
<div class="popup"> 
    <div style="overflow:hidden;">Printer Version 
    <div style="float:right;"> 
     <input type="button" ID="btnPrnClose" value="X" onclick="return closePrint()" /> 
    </div> 
    </div> 
     <iframe id="frPrint" style="width:100%;"></iframe> 
    </div> 
</div> 
</div> 

<script type="text/javascript"> 
     function getContent() { 
      return '<div>' + 
'<div class="right no-print" onclick="printMe();" style="cursor: pointer;" title="Print"> \ 
    <img alt="Print" src="/images/printer.png" /></div>' + document.getElementById('gvOuterContainer').innerHTML+ '</div>'; 
     } 
     function closePrint() { 
      document.getElementById('divPrint').style.display = 'none'; 
     } 
     function PrintMessage() { 
      document.getElementById('divPrint').style.display = ''; 
      document.getElementById('frPrint').src = "print.html?a=" + Math.random();//force no-cache 
      return false; 
     } 
</script> 

2) 페이지에서 인쇄하십시오.

<style type="text/css" media="print"> 
    * 
    { 
     border: none!important; 
    } 
    .noprint,.popup 
    { 
     display: none!important; 
    } 
    #scrollContainer 
    { 
     width: auto!important; 
    } 
    .pop-show 
    { 
     display: table!important; 
     left: 0; 
     margin-left: 0; 
     top: 0; 
     width: 100%!important; 
     z-index: 100; 
    } 
/* and so on */ 
</style> 

세부 사항이 다를 수 있습니다.

+0

방금 ​​gridview.that 하나의 속성을 가지고 vim

1

마지막으로 가지고 대답은, 내가

<asp:TemplateField ItemStyle-HorizontalAlign="Center"> 
관련 문제