10

アイテムの特定のリストの現在のタスクの一部として、ユーザーはそれらのいくつかを選択し、選択したアイテムの「印刷」を呼び出すことができます。

選択した項目ごとに、詳細を印刷する必要があります。これは、販売システムで選択されたアイテムの請求書を印刷することに似ています。

各レコードの詳細を書き込む部分ビューを作成しましたが、要件に従って使用する方法がわかりません。

私の要件を達成するために、document.ready で jQuery print を呼び出すことはできますか?

@Levib が示唆したように、PrintView で部分ビューを呼び出します。PrintView の document.reay 関数は window.print を呼び出しています。しかし、「印刷」を起動しようとすると、印刷ダイアログが表示されません。

これが私の見解です。

@section Styles
{
    <link rel="stylesheet" href="AdminStyle.css" type="text/css" media="all" />
    <link rel="stylesheet" href="AdminPrintOrder.css" type="text/css" media="print" />
}

@foreach (var item in Model)
{
    <div id="content" style="page-break-before: always">
        @{Html.RenderPartial("_OrderDetailView", item);}
    </div>   
}

@section scripts
{
    <script type="text/javascript">
        $(document).ready(function () {
            debugger;
            window.print();
        });
    </script>
}

そして、私の印刷インボーカービューは

 function printInvoices(){
            $.ajax({
                type: 'POST',
                url: '/Batch/PrintInvoices',
                data: '{ "allocationId" : "' + unSelected.toString() + '"}',
                contentType: "application/json; charset=utf-8",
                traditional: true,
                success: printedView,
                error: errorInSubscribing
            });
        }

印刷ダイアログに入力するために ajax reposne を処理する必要がありますか?

 function printedView() {
            unSelected = [];
        }

そしてコントローラーアクションは

[HttpPost]
        public ActionResult PrintInvoices(string allocationId)
        {
            var context = new BatchContext();
            var orderDetails =  context.GetOrderDetails(RetriveList(allocationId));
            return View(orderDetails);
        }
4

3 に答える 3

15
  • ページの印刷スタイルシートを定義します。@media print 宣言を使用してこれを行います。
  • 次にできることは、印刷するページの各部分ビューを div でラップし、それに'page-break-before: always'CSS 属性を適用することです。

これにより、各部分ビューが最終的に異なるページに表示されるようになります。ページの読み込みを呼び出し'window.print()'て完了です。

この回答のコメントで提起された広範な質問を考慮して、何をする必要があるかについてのより詳細な説明を以下に示します。

準備

  • 印刷時にページがどのように見えるかを定義するスタイルシートを定義してページに適用する必要があります。
    • これは@media print { }、既存のスタイルシートで宣言を使用するか、スタイルシートを含むページのタグにmedia="print"属性を適用することで実行できます。linkあなたはこれを正しく行ったようです。
    • このスタイルシートには、page-break-before: always改ページが必要なすべての要素の宣言が含まれている必要があります。インラインスタイルでこれを行ったようです。個人的には、インライン スタイルとしてではなく、印刷スタイルシートでこれを実行したいと思います。この手順は、ページごとに 1 つのアイテムを印刷できるようにするために不可欠です。

印刷

  • window.print()ページの作成者は、いつページを印刷するかを定義できます。CTRLこれは+または印刷ボタンをクリックするのと同じことをP行いますが、JavaScript から実行できる点が異なります。
  • Ajax は、本質的に印刷とは何の関係もありません。Ajax は、ページを変更またはリロードして結果としてページを更新することなく、ページから HTTP 呼び出しを非同期に行う手段です。ユーザー入力に基づいて印刷するアイテムをページに動的に追加したい場合は、Ajax を使用することで十分に実現できます。ページを印刷するだけの場合は、Ajax を使用する必要はありません。ナビゲーター。**

2 つの重要なポイント:

  • window.print()現在画面に表示されているページを印刷します。別のページを印刷したい場合は、他のページを何らかの方法で形状またはフォーム (おそらくポップアップを介して) にロードし、そのページで window.print() を呼び出す必要があります。
  • 印刷スタイルシートは、画面上のバージョンとは対照的に、印刷されたページがどのように見えるかを定義します。これは、アイテムのページと他の多くのものを用意し、ユーザーが印刷ボタンをクリックしたときにアイテムのみを印刷できることを意味します。display: noneこれを行うには、印刷ページに表示したくないすべての要素の印刷スタイルシートでプロパティを設定します。

PDF について:

必要に応じてページを PDF にエクスポートすることに反対はありませんが、PDF ソリューションについて具体的に質問されていないため、質問に対する HTML+CSS ソリューションを提供しました。PDF の生成と読み込みにも 1 分ほどかかります。ただし、ユーザーが印刷中のコピーを保存したい場合には最適です。これがあなたのサイトに当てはまる場合は、そのような解決策を検討することを強くお勧めします.

テスト:

印刷スタイルシートをどのようにテストしますか? 最も簡単な方法は、Chrome の印刷ボタンをクリックすることです。印刷するとサイトがどのように表示されるかを示すプレビューが表示されます。

最後の言葉:

今のところは忘れてwindow.print()、適切な CSS を適用してページを本来あるべきように見せることに集中してください。CSS を記述し、ページを実行し、Chrome で出力を確認し、必要に応じて印刷スタイルシートを変更します。すすぎと繰り返し。印刷ボタンをクリックしたときに希望どおりにページが表示されたら、JavaScript で印刷機能を自動的に呼び出す方法を検討する必要があります。

于 2012-11-29T16:03:05.437 に答える
7

MVCで印刷する方法：

  1. 印刷したいものを思い通りにレイアウトしたビューを作成する
  2. Rotativaライブラリを使用して、MVC ビューを PDF ドキュメントに変換します。

アクションを次のように変更するだけです

public ActionResult PrintInvoice(int invoiceId)
{
  return new ActionAsPdf(
                 "Invoice", 
                 new { invoiceId= invoiceId }) 
                 { FileName = "Invoice.pdf" };
}

CSS の改ページに従うと思いますので、1 ページに 1 つの項目のみを印刷する必要がある場合は、そのマークアップを使用して項目を新しいページに強制できます。

于 2012-11-29T16:01:54.707 に答える
1

ページのレイアウトをより適切に制御するために PDF を作成します。

jQueryを使用すると、ユーザーから選択したアイテムを取得し、ajax呼び出しまたは単純なPOSTをアクションメソッドに送信して、アイテムのリストをパラメーターとして受け入れ、pdfを含むファイルストリームを返します。

実行時または設計時の両方で PDF を作成するための無料の商用ライブラリが多数あります。

私は個人的にDevExpressを使用しており、満足しています。

オープンソースの代替手段として、PDFSharpを検討できます

于 2012-11-29T16:03:16.650 に答える