2017-07-21 17 views
1

Google Apps Script「Web App」があります。作成した2ページのダッシュボードの改ページを作成しようとしています。Google WebアプリケーションのHTMLページ区切りが機能しない

私は基本的なウェブアプリhereを発行してこの問題を再現しました。ここにコード全体があります。

<body> 
<div>page1</div> 
<div class="break"></div> 
<div>page2</div> 
</body> 

<style> 
.break{ 
display:block; 
page-break-before:always; 
} 
</style> 

Webアプリが1つのIframeに表示されていて、中断がないためですか?

もしそうなら、複数のIframeに分割できますか?

かそれとも私は行方不明です。

編集:私は今も

div.break{ 
display:block; 
page-break-before:always; 
} 

そして

@media print { 
div.break{ 
display:block; 
page-break-before:always; 
} 
} 

とその何も変更しませんでした試みました。 Chrome & IEで試したところ、両方ともページ区切りを無視しました。

EDIT 2:

私は、プレーンテキストファイルに私のコードをコピーして、Chromeでそれを開くと、それは2ページに印刷するので、それはIFRAMEの問題でなければならないと思います。だから、アプリスクリプトでそれを使用すると、おそらくすべてが1つのiframeの内側にあるため、ブレークは無視されなければなりません。うーむ....

おかげ

答えて

2

Google Apps Scriptで表示されるhtmlはiframeです。 Webアプリケーションページを印刷しようとすると、このiframeは複数のページに印刷できません。

ソリューション:iframeのコンテキストで取得するには、たとえばページ1のために、あなたのWebアプリケーション内のいくつかのテキストを選択し、印刷を打つ...、それはあなたがテキストを選択しただけでiframeことを印刷します:

enter image description here

編集:

あなたはそれよりユーザーFR作るために右のあなたのWebアプリページに「印刷...」ボタンを追加することができますiendly:

<div>page1</div> 
<div class="break"></div> 
<div>page2</div> 

<!-- added print button (with class "hide-on-print" to not display it when printed) --> 
<button id="print" class="hide-on-print">Print...</button> 

<script> 
// open print dialog on button click 
document.getElementById('print').addEventListener('click', function(){ 
    window.print(); 
}); 
</script> 

<style> 
@media print { 
    .hide-on-print { 
     display: none 
    } 
    .break{ 
     display:block; 
     page-break-before:always; 
    } 
} 
</style> 
+0

ああ私の善良さはどれくらい奇妙なのですか!なぜ地球上で働くのですか?それは私のライブダッシュボードでも機能します。ちょっと奇妙なことに、印刷前に見出しを強調表示するようにユーザーに指示する必要がありますが、それが唯一の選択肢であれば.... – MrPea

+0

@MrPea Webアプリケーションページに印刷ボタンを追加することができます。 – Kos

+0

偉大な心は似ていると思う。私はまったく同じことをしました。あなたの洞察がなければ私はあなたの答えを正しいものとしてマークするつもりです。 – MrPea

0

は{div.break {}}これを試してみてください@mediaプリントを使用してください。

+0

ありがとうございました。残念ながらそれはそれを働かせていません – MrPea

+0

再び感謝します。まだ喜びはありません。私は質問を編集して、コード全体とテスト公開アプリへのリンクが動作していないことを確認することができます。 – MrPea

+0

私はApps Script WebアプリケーションとそのIframeの使用に制限があると思います。コードをプレーンテキストファイルに入れると、うまく動作します。 – MrPea

1

すべてのクレジットの最初には、私はiframe内のテキストをハイライト表示した場合、それはその後、正しく印刷さていることを指摘するためにコスに行かなければならない - 私はそう

が、今私が」というしようとする考えはなかっただろうページ自体の代わりにiframeだけを表示する小さな関数が追加されました。

function printall() { 
window.print(); 
window.frames[0].print(); 
} 

と、その機能のダッシュボードにボタンを追加しました。ユーザーが通常の印刷メニューを使用していないことを確認します。

関連する問題