Auto-Druck mit jquery

8

Ich habe die Daten im folgenden Format:

(Dummy-Einträge) (id = posGridView)

Wenn ich den Verkauf verarbeite, wird automatisch ein kleiner Beleg mit ausgewählten Spalten gedruckt, nicht mit allen Spalten.

Da alle Daten in dieser Rasteransicht verfügbar sind, Wie kann ich sie dynamisch in einem beliebigen Format mit jquery drucken?

Bearbeitet

Eigentlich möchte ich in diesem Format dynamisch aus der obigen Rasteransicht drucken

    
Shahid Ghafoor 10.06.2012, 21:29
quelle

1 Antwort

27

Drucken

Sie brauchen jQuery nicht, um eine Seite zu drucken, Sie brauchen nur die JavaScript-Funktion: window.print(); .

Wenn Sie einen bestimmten Inhalt drucken möchten, können Sie den Rest (und formatieren Sie den gedruckten Bereich) durch CSS ausblenden:

%Vor%

Wie Sie sehen, können Sie durch Festlegen des Attributs Medien Ihres Stiltags Stile für die normale Ansicht (Bildschirm) und die Druckansicht (Drucken) einrichten. Der vollständige Artikel ist hier .

Dynamik

Sie können dem Prozess eine gewisse Dynamik hinzufügen, aber denken Sie daran, dass es für den Benutzer dinamisch sein kann, aber in Ihrem Code müssen Sie das -Ereignis finden um den Druck anzuhängen . Dieses Ereignis könnte ein Klick in einen Anker sein:

<a href='javascript:window.print();'>Print</a>

Es könnte das onload -Ereignis Ihrer Seite sein:

%Vor%

Oder ein anderes Ereignis, das Sie möglicherweise beachten müssen (beachten Sie, dass ich jetzt jQuery verwende):

%Vor%

Der obige Code ist ziemlich einfach: Nach drei Sekunden, in denen der Benutzer eine Eingabe hinterlässt, wird printPage ausgelöst. Wenn eine Eingabe innerhalb dieser drei Sekunden den Fokus erhält, wird printPage nicht aufgerufen. Ich glaube nicht wirklich, dass dieser genaue Code das ist, was Sie brauchen, aber ich werde den Punkt aufzeigen, wie man Dynamik nachahmt. Hier sehen Sie die setTimeout und clearTimeout Definitionen.

BEARBEITEN: Ich empfehle Ihnen kaum, Ihr unerwünschtes HTML-Dokument über CSS wie oben beschrieben zu verstecken und window.print aufzurufen. Wie auch immer, hier bin ich ein Code hinzufügen, um es durch eine neue Seite zu tun.

Drucken von einer brandneuen Seite

Wenn Sie von eine völlig andere Seite als die angezeigte Seite drucken möchten, können Sie nach dieser Seite fragen, den HTML-Code auf Ihrer Serverseite verwalten und dann die Seite zum Drucken anweisen sobald geladen. Es gibt mindestens zwei Möglichkeiten, dies zu tun. Lass sie Schritt für Schritt sehen:

A) Die erste Wahl besteht darin, Ihre GridView an Ihre neue Seite zu senden und von dort aus zu drucken. Das Problem ist, dass Sie nicht einfach eine neue Seite dafür öffnen können. Sie müssen also von Ihrer Seite zu einer neuen Seite wechseln, die Ihren HTML-to-Print anzeigt.

A1) Dazu müssen Sie Ihre GridView mit einem Formular umgeben:

%Vor%

A2) Dann rufen Sie von * btnPrint_Click * Ihre "printPage.aspx" auf. Denken Sie daran, dass diese Änderungen möglicherweise nicht verfügbar sind, wenn Sie GridView mit JS / jQuery geändert haben (da es wahrscheinlich ist, dass .NET eine verdeckte Statusvariable statt Ihrer GridView liest).

B) Die zweite Möglichkeit ist JavaScript. Aber denken Sie daran, dass Sie mit dieser Wahl Schwierigkeiten haben werden, wenn Sie Ihre Tabelle auf Ihrer neuen Seite bearbeiten wollen (da Sie keine GridView erhalten, erhalten Sie HTML). Die gute Sache ist, dass Sie leicht eine neue Seite öffnen können:

B1) Natürlich brauchst du ein Formular (beachte sein Ziel und seine Aktion), etwa:

%Vor%

B2) Dann müssen Sie Ihre Daten an diesen Anker übergeben. Bevor Sie das Formular absenden, setzen Sie die Eingabe mit Ihren Tabellendaten:

%Vor%

Sobald Sie die Daten auf Ihrer Serverseite (printPage.asx) haben, können Sie ganz einfach Ihren HTML-to-Print erstellen und window.print () auf der Seite onload wie oben beschrieben aufrufen .

    
Ale 11.06.2012, 00:16
quelle