PDA

View Full Version : Ext.ux.PrinterFriendly



Steffen Hiller
4 Apr 2008, 2:42 PM
Hey,

I'm happy to announce the first release of my (first) Ext JS extension.
Here are the facts:

Name
Ext.ux.PrinterFriendly

Summary
Easily build printer friendly layouts and grids for your Ext JS pages.
Works for Ext JS 3.3.0.
(Previous versions were also supported, check the commit logs, to get older versions that work with Ext JS 2.0 - 3.2.1.)

Features

Builds a normal html table (Ext.ux.PrinterGridPanel) based on your data store and column model, which saves a lot of cpu power and memory when printing large data sets. Moreover it shows all rows. (Remember, you can't use ext's pagination or scrolling on paper. ;-))
Remembers the state of your grid, such as that hidden columns stay hidden in printer friendly view, keep their column order and keep the row sorting. (This is not really a feature of this extension, it just uses the fabulous Ext.state.Manager, but I think it's important to mention, since this was an important requirement for me.)
Completely Javascript-driven, no need for extra server-side coding for printer friendly pages
Enables easy debugging of your printer-friendly layout (just add ?format=printerfriendly to your page url to see printer friendly view)
Enables adding your custom stylesheet for your printer-friendly format
Grouping View and Store support (New)


Source
http://github.com/steffen/ext.ux.printerfriendly/tree/master
If you don't have git, you can download the zip or tar file of the latest version from:
zip: http://github.com/steffen/ext.ux.printerfriendly/zipball/master
tar: http://github.com/steffen/ext.ux.printerfriendly/tarball/master

Install

<!-- Your Ext JS files -->
<script type="text/javascript" src="[YOUR PATH]/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="[YOUR PATH]/ext-all.js"></script>

<!-- Ext.ux.PrinterFriendly files -->
<script type="text/javascript" src="[YOUR PATH]/Ext.ux.PrinterFriendly/config.js"></script>
<script type="text/javascript" src="[YOUR PATH]/Ext.ux.PrinterFriendly/ext.ux.printerfriendly.js"></script>

<!-- Your page-specific javascript files (with Ext.onReady) -->
<script type="text/javascript" src="[YOUR PAGE-SPECIFIC JAVASCRIPT FILE]"></script>

Usage
See http://www.sencha.com/learn/Extension:PrinterFriendly

Examples
See examples folder in root of the repository.

Feedback
Any Feedback via comments on this post in this forum or in my blog (http://www.extjswithrails.com/) is welcome!

I hope you find this extension as useful as I do! :-D

Regards,
Steffen

Hani
4 Apr 2008, 6:56 PM
Looks very useful, but doesnt work on safari

Steffen Hiller
4 Apr 2008, 7:36 PM
Looks very useful, but doesnt work on safari

Hey hani, my bad, I didn't test it on safari nor internet explorer. :"> Only Firefox 2. I just tested it on my Safari 2 (Mac) and the PrinterGridPanel did not show up. I guess that's what you mean with "not working", right? Well, thanks for the hint, I'll check that this weekend!

Regards,
Steffen

jerrybrown5
4 Apr 2008, 9:24 PM
This is a nice idea. Pure HTML rendering is also helpful in SEO caching strategies, which of course is a gaping hole in fully rendered Ext pages. As of right now you need to manually create redundant stupid/simple landing pages for everything that you want cached by the search engines. Saying goodbye to this equals a good thing. :-?

Best regards,
Jerry Brown

Steffen Hiller
4 Apr 2008, 11:11 PM
Pure HTML rendering is also helpful in SEO caching strategies

Hey Jerry,

even though SEO would be a good side effect of this extension, I don't think that this extension is actually more SE-friendly. The difference between my PrinterGridPanel class and the official GridPanel class is "only" that the rendering process is less cpu and memory intensive and that the generated html is smaller than with the normal GridPanel.
BUT, the table/grid is still generated by javascript, and that's still the same problem for search engines, as with the normal GridPanel.
So if you want to do SE-optimized landing pages, I think you still would have to do extra server-side coding.
Sorry on disappointing you on that part, or do I look at this the wrong way?

Regards,
Steffen

jerrybrown5
4 Apr 2008, 11:57 PM
Steffen,
You are right in that it would have to tie into a server based solution for which simple html (from javascript creation) is only a part of it. What is needed is a simple server based Ext aware IEBrowser (shdocvw.dll or similar) web bot component to go through a site with a certain querystring to clear the javascript and extract simple and very cacheable html. Alternatively, you could do the same with firefox on a string (XPCOM?). Once you can generate the simple html on command the rest is easy.

The thee current and not very good choices:
* Simple Web 1.0 site which is SEO cacheable and steadily lose customers to Web 2.0 sites (not an option)
* Fully JS rendered Web 2.0 site which is not SEO cacheable and wait on laurels for the SEs to improve (not an option)
* Double programming (not an option)


Best regards,
Jerry

tyr
5 Apr 2008, 3:43 AM
... a very interesting extension.
'PrinterView's are a very usefull feature. I look forward to see more about this ;-)

Steffen Hiller
5 Apr 2008, 10:42 AM
Hey Jerry,

ok, I got it. Combined with your mentioned technologies, this extension really could offer SEOs another option. A good side effect then. :-)

Regards,
Steffen

vizcano
8 Apr 2008, 3:06 AM
I'm trying the example provided, and I've seen that if you increase the items of the array it does not print more than one page, is there a way to print more than one page? I've got a huge grid and i'd like to be able to print it, I need at least 3pages to print it

Thanks

Steffen Hiller
8 Apr 2008, 5:16 AM
I'm trying the example provided, and I've seen that if you increase the items of the array it does not print more than one page, is there a way to print more than one page? I've got a huge grid and i'd like to be able to print it, I need at least 3pages to print it

Thanks

Hey vizcano,

did you set the Ext.PRINTER_FRIENDLY_CSS_URL constant in your ux.PrinterFriendly/init.js file? That css is important for exactly your problem.

Regards,
Steffen

vizcano
8 Apr 2008, 6:16 AM
Hi!

I've setted the correct PATH in init.js (i've also tried with printer-friendly-array-grid.css), but I still have the same print archive. I send you a copy of it. I don't know what's wrong...

Steffen Hiller
8 Apr 2008, 6:22 AM
Hi!

I've setted the correct PATH in init.js (i've also tried with printer-friendly-array-grid.css), but I still have the same print archive. I send you a copy of it. I don't know what's wrong...

Hmm ok, what browser are you using?

vizcano
8 Apr 2008, 6:28 AM
This result is from Firefox 2.0.0.13, on IE 7 i get a screenshot, but I've seen it's not operative for IE so I've tried with FF

Steffen Hiller
8 Apr 2008, 6:48 AM
This result is from Firefox 2.0.0.13, on IE 7 i get a screenshot, but I've seen it's not operative for IE so I've tried with FF

Ok, actually now I see in your pdf that your css file is not loaded probably. (Missing padding in the tbody part.) Please make sure that your PATH in the init.js is right! I think it's not :-)
Can you post the line from your init.js?

P.S. In IE7 is not working yet, that's right, I'm trying to release a new version today where it should work in IE7, too.

vizcano
8 Apr 2008, 6:54 AM
I didn't know what was the correct css file so I tried with:


Ext.PRINTER_FRIENDLY_CSS_URL = 'resources/css/printer-friendly.css';

and


Ext.PRINTER_FRIENDLY_CSS_URL = '../examples/grid/printer-friendly-array-grid.css';

and it does not work, i had the same result in both. Thanks :)

Steffen Hiller
8 Apr 2008, 6:59 AM
Ah ok,
it should be printer-friendly.css, but

Ext.PRINTER_FRIENDLY_CSS_URL = 'resources/css/printer-friendly.css';
looks not right.

The printer-friendly.css is in the Ext.ux.PrinterFriendly extension folder. The path should be relativ from your printer-friendly-array-grid.html file, or try to set an absolut path.

vizcano
8 Apr 2008, 7:16 AM
Ok, with the absolute path it works perfectly, thanks a lot :)

vizcano
8 Apr 2008, 9:29 AM
Hi again!!

I'd like to know if there is any way to avoid preview panel? Because I'd like to print directly when I press my buttom.

Steffen Hiller
8 Apr 2008, 10:13 AM
Hi again!!

I'd like to know if there is any way to avoid preview panel? Because I'd like to print directly when I press my buttom.

Hey vizcano, I think there is a way, but I haven't implemented that functionality yet. I was planning that feature for the 0.3 release, which should be out next week. I hope you can wait until then... :s
P.S. This functionality is not so trival, that's why it needs a little testing/time.

Steffen Hiller
8 Apr 2008, 1:22 PM
Just uploaded Version 0.2. Besides many internal improvements it's working for Safari, IE6 and IE7 now as expected.

miakamayani
8 Apr 2008, 5:56 PM
Hi! I am newbie in ExtJs :p adn found that this extension is very useful. How to make the Printer Preview window just contain the grid, not the entire page and what configuration do I have to do to customize the Printer Preview window so it's not maximized. Thank you so much

Steffen Hiller
8 Apr 2008, 6:25 PM
Hi! I am newbie in ExtJs :p adn found that this extension is very useful. How to make the Printer Preview window just contain the grid, not the entire page and what configuration do I have to do to customize the Printer Preview window so it's not maximized. Thank you so much

Hi miakamayani,
in the example you could replace the panel code with the following:



new Ext.Panel({
renderTo: "body",
layout: "fit",
border: false,
bodyBorder: false,
items:
new Ext.ux.grid.PrinterGridPanel({
store: store,
columns: columns,
stateId: 'array-grid',
autoExpandColumn: 'company',
title: 'Array Grid'
})
});


and also remove the <div id="description">... code in the html file.

Right now it's not possible to prevent the maximization of the printer window via a config option. If you know how you could extend the class. Or you wait until next week, I'll add that as an option in the next release. ;-)

vizcano
8 Apr 2008, 10:52 PM
Thank you for the new version I'm trying it right now :)

Id like to ask you if your printer module is able to print grids like this: http://extjs.com/deploy/dev/examples/grid/grouping.html

Because when i set the view



var view1= new Ext.grid.GroupingView({
forceFit:true,
groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
});


In to my PrinterGridPanel it renders OK, but don't work properly, I send you a screenshot of the view and an example of the printed page.

Thanks so much :)

elinu
9 Apr 2008, 5:37 AM
Thanks for a very useful extension!
I was wondering if there is a way of printing a grid containing a RowExpander?
The first picture shows the table that I want to print with it's rows expanded.
The second picture shows what is now shown in the print preview when I use the same store and columnModel for the two tables.
Would be really greatful for any help. :)

Steffen Hiller
9 Apr 2008, 7:21 AM
Hey vizcano and elinu,

thanks for your good bug reports (or feature requests). RowExpander and GroupingView is unfortunately not supported yet. I'm not sure when I'll be able to add those two features. It would definitely make sense to add them to the extension. For the next release I wanted to concentrate on the "one-click-print" feature.
I'll be setting up a svn or git repo for this extension to make development and contributing easier. Anybody likes to try to add this feature by himself? ;-)
Otherwise I'm afraid to say that you might have to wait 2-3 weeks...

Sorry for this not so good answer...

Regards,
Steffen

BigTitus
11 Apr 2008, 2:57 AM
Hi Steffen,

thanks for this extension, it's exactly what I was looking for. :D
But I am facing one problem: After I was running your test case without any problems I tried to build your extension into my app. The preview window appears but no grid is shown. Tracking that down it shows that "onPrinting" will not be called. Any idea what could be the reason for that? :-/

Thanks in advance for your help!
BT

Steffen Hiller
11 Apr 2008, 9:30 AM
Hi BigTitus,

are you sure that onPrinting is not getting called? Did you test it with alert() or console.info() (firefug will not display this in your console, you have to use parent.console.info() instead or
open your printerfriendly page in your browser directly by adding the _format=printerfriendly parameter to your query string.)

Let me know if that helps ...

Regards,
Steffen

BigTitus
14 Apr 2008, 12:31 AM
Thanks for your answer! Meanwhile I figured out how your extension is working and I found that it could not work in my app because my grid is loaded by ajax. :s I don't see a chance to get this working, do you?

Steffen Hiller
14 Apr 2008, 7:45 AM
Thanks for your answer! Meanwhile I figured out how your extension is working and I found that it could not work in my app because my grid is loaded by ajax. :s I don't see a chance to get this working, do you?

Hi, it works with ajax, too. Show me your grid code for your onReady part and I'll show you how to set it up in the onPrinting part.

BigTitus
14 Apr 2008, 8:59 AM
Hey Steffen,

thanks a lot for your help!

My code looks like this:



Ext.onReady(function() {
Ext.Ajax.request({
url: '/get_some_data/for_my_grid',
success: function() {
var grid = new Ext.grid.EditorGridPanel({
id: 'my_grid',
store: my_store,
autoWidth: true,
stripeRows: false,
});
main.add(grid);
main.doLayout();
}
});
});


Do you need some more information?

Steffen Hiller
14 Apr 2008, 9:06 AM
Hey BigTitus,

is this code actually working? ;-)
How is your my_store variable defined?
Why you don't set up a Ext.data.Store with a Ext.data.HttpProxy instead of using the Ajax class?

BigTitus
14 Apr 2008, 11:11 PM
Hey Steffen,

I do but this is just a minified part of a big application where content is always loaded with ajax. My store looks like:



var my_store = new Ext.data.GroupingStore({
proxy: new Ext.data.HttpProxy({
url: '/blabla/load_data'
}),
reader: new Ext.data.JsonReader({
totalProperty: 'count_all',
root: 'data_root',
})
});


Sorry, the whole code is to complex to post it here so I try to show you what need to point me in the right direction. ;)

The onPrinting function is near to your example:



Ext.onPrinting(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

new Ext.Panel({
renderTo: "body",
layout: "table",
layoutConfig: {
columns: 1
},
border: false,
bodyBorder: false,
items: [
new Ext.BoxComponent({
el: 'description'
}),

new Ext.ux.grid.PrinterGridPanel({
store: grid.store,
colModel: grid.getColumnModel(),
stateId: 'my_state',
title: 'Preview'
})
]
});
});


So, what's my mistake?

Steffen Hiller
15 Apr 2008, 3:39 AM
Hey BigTitus,

ok, here are some guesses why your onPrinting code is not working.
1. Does your body tag has the "body" id?
2. Do you call grid.store.load()?
3. Try to use Ext.data.Store instead of Ext.data.GroupingStore. GroupingStore and GroupingView are not supported yet.

I hope that fixes the problem!?

BigTitus
15 Apr 2008, 6:04 AM
Thanks a lot for your tries but I'm afraid the problem is more complicated. :-?

The preview window pops up correctly but there is no content. It seems to me the problem is that the iframe has the current url as source. But as I already mentioned the grid has been loaded with ajax. Calling the url from browser address field again is the same as reloading the whole page. And the start page has no grid. :-|

Do you see what I mean?

Steffen Hiller
15 Apr 2008, 8:29 AM
Hey BigTitus,

exactly, the page is loaded again, that means you have to load everything "again".
The only difference is, that the URL of the iframe contains the _format=printerfriendly parameter, which is used to call onPrinting instead of onReady.
Well, there is no much magic in this part. Do the following: Try to call the iframe page directly with your URL + the _format=printerfriendly parameter (easier to debug). Then insert the same code in the onPrinting part as you have in the onReady part. If if it works (the page should look as the normal page), try to change the onPrinting code to the code/result you want as your printerfriendly format.

Regards,
Steffen

BigTitus
16 Apr 2008, 7:02 AM
Yeah, I see what you mean. That could become a bit difficult in my case but I think I will handle it. ;)

Thanks a lot for your help again! And of course for your great extension! =D>

DigitalSkyline
16 Apr 2008, 7:23 AM
I have an idea for you... one that I thought of implementing but perhaps someone else is more motivated and/or has more time to invest in this. By utilizing HendricD's mIframe you could use an iframe, load it with Ext (by way of his integrated methods, should not even have to hit the server again), make this iframe printable using your methods, inject whatever component you want in to this iframe ... voila! Printable without opening a new window, and without reloading all the overhead of Ext.

(or perhaps not, but it does seem doable in concept)

margozzi
21 Apr 2008, 3:28 PM
Rather than rendering the printer friendly version where the original non-friendly one was, is it possible to render to a new browser window? Or to obtain the generated HTML and write it to a newly created window?

Steffen Hiller
21 Apr 2008, 5:19 PM
Hey DigitalSkyline,

sorry, somehow I didn't see your message.
Thanks for the idea and your message. I actually had the same idea and tried to use HendricD's MIframe extension when I started working on the PrinterFriendly. First I also was thinking using the miframe would be an advantage, since it saves a server request. Well, after testing a while with the miframe extension I found that it's actually not very easy/trivial to realize that with miframe. Well, since my days also only have 24h, I was thinking to keep it simple and solve it with a normal iframe and an extra server request, but without having to modify any server-side code. Actually, besides the round-trip to the server, their shouldn't be much overhead since the ext js files should be cached anyway. And normally you would need to reload your data anyway, too, to fetch all records instead only one page (in case you're using pagination).
Afterall I also was thinking that when the extension is more lightweight, other people that like to use it have less problems of understanding and using the extension. It's also easier to debug. But I certainly agree that my extension and the miframe extension would be a good combination. Maybe some day I have that requirement and implement the miframe or someone else can do it.

Regards,
Steffen

Steffen Hiller
21 Apr 2008, 5:34 PM
Rather than rendering the printer friendly version where the original non-friendly one was, is it possible to render to a new browser window? Or to obtain the generated HTML and write it to a newly created window?

Hey margozzi,

well, this should be actually pretty easy for you to implement, since their is no big difference between an iframe and an extra browser window.
Just call something like


printer_window = new Ext.ux.PrinterWindow;
window.open(printer_window.iframeSrc());


I hope that helps.

Regards,
Steffen

louis75168611
21 Apr 2008, 10:15 PM
is very good!!:D

CALM
22 Apr 2008, 1:05 AM
can i use this extension when i use viewport?i can't display gridpanel when body is hidden.

Steffen Hiller
23 Apr 2008, 2:34 PM
can i use this extension when i use viewport?i can't display gridpanel when body is hidden.

Hey CALM,
could you give some more details about your problem? Where do you want to use the viewport, in the printer or in the screen view? It doesn't make much sense to use it in the printer view, though.

margozzi
26 Apr 2008, 11:03 PM
Hey margozzi,

well, this should be actually pretty easy for you to implement, since their is no big difference between an iframe and an extra browser window.
Just call something like


printer_window = new Ext.ux.PrinterWindow;
window.open(printer_window.iframeSrc());
I hope that helps.

Regards,
Steffen

Here is what I ended up doing:


function print(){
var printPanel = new Ext.ux.grid.PrinterGridPanel({
store: syslogGrid.getStore(),
cm: syslogGrid.getColumnModel(),
title: 'Syslog Messages'
});
var printWindow = window.open ('','Syslog Messages','status=1,toolbar=1,menubar=1,resizable=1,scrollbars=1,height=600,width=800');
printWindow.document.writeln( '<html><head><title>Syslog Print Window</title>' );
printWindow.document.writeln( '<script>');
printWindow.document.writeln( 'var ss = document.createElement("link"); ss.setAttribute("rel", "stylesheet");ss.setAttribute("type", "text/css"); ss.setAttribute("href", "/eem-app/resources/css/ext-all.css");document.getElementsByTagName("head")[0].appendChild(ss);');
printWindow.document.writeln( 'var ss = document.createElement("link"); ss.setAttribute("rel", "stylesheet");ss.setAttribute("type", "text/css"); ss.setAttribute("href", "/eem-app/resources/js/Ext.ux.PrinterFriendly/resources/css/printer-friendly.css");document.getElementsByTagName("head")[0].appendChild(ss);');
printWindow.document.writeln( '</script>');
printWindow.document.writeln( '</head><body></body></html>' );
printPanel.render( printWindow.document.body );
printWindow.document.close()
}

It works great with one exception. I am not getting more than the first page of rows. In an earlier thread you said "did you set the Ext.PRINTER_FRIENDLY_CSS_URL constant in your ux.PrinterFriendly/init.js file? That css is important for exactly your problem." However, in your 0.2 revision change notes you put: "Removed Ext.PRINTER_FRIENDLY_CSS_URL constant" So what is the trick now to get more than the first page of a table with paging printed?

Mike

Steffen Hiller
28 Apr 2008, 10:31 AM
Hey margozzi,

the code is a good start to pinpoint the problem.
Did you check with firebug that the two stylesheets in your window actually are loaded?

Could you prepare a sample html file with the code below that is working out of the box (don't need to include ext lib, only the references and i adjust the path to my environment). With working I mean that you can print it put the page is cut off.

Regards,
Steffen

margozzi
28 Apr 2008, 10:43 AM
Yes, both css files are being loaded. Not sure why but simply putting the tags in there did not work!??! I can see both are loaded and changes made to the css are reflected in the GUI. Not exactly sure what you are looking for. I will email you printable HTML.

vizcano
30 Apr 2008, 12:19 AM
Hi again!!

I've got this code




Ext.onPrinting(function(){
// Add stylesheet that get's applied when you open your print preview (and when printing your page)
Ext.addStyleSheet("grid.css");
// Or use Ext.util.CSS.swapStyleSheet( String id, String url ) to remove (via id) and add a new StyleSheet

// Don't forget to set the state manager, if you want to remember the state for your columns in the printer friendly view (hidden, order, sorting)
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

new Ext.Panel({
renderTo: "center_c",
layout: "table",
layoutConfig: {
columns: 1
},
border: false,
bodyBorder: false,
items: [
new Ext.BoxComponent({
el: 'tabla3'
}),

// Special PrinterGridPanel which is optimized for performance for printing large data sets,
// and which shows all rows (since you can't scoll on paper)
new Ext.ux.grid.PrinterGridPanel({
store: store_grid_p3,
reader:reader,
columns: columns,
//si pongo la vista casca
//view:view,
stateId: 'array-grid'

})

]
});

});



And I want to access to the store from the printer grid panel, because depending on previous parameters i'd like to charge one store or another.

Does anyone know how to do it?

Thanks :)

Steffen Hiller
30 Apr 2008, 7:03 AM
And I want to access to the store from the printer grid panel, because depending on previous parameters i'd like to charge one store or another.

Hey vizcano,

can you describe your problem a little more, I'm not completely understanding what you are trying to accomplish.

Regards,
Steffen

vizcano
30 Apr 2008, 7:14 AM
In " Ext.onReady(function()" I've got a TabPanel, on each tab I show a datagrid, so I've added a toolbar for eachpanel with a buttom to print the grid.



new Ext.TabPanel({
region:'center',
contentEl: 'center',
width: 200,
minSize: 175,
maxSize: 400,
deferredRender:false,
margins:'5 5 5 0',
activeTab:0,
enableTabScroll:true,
items:[
{
//se muestran la tabla
contentEl:'center_a',
title: 'Datos Zona',
closable:false,
iconCls: 'datos',
autoScroll:true,
//al final la barra de herramientas en el tabpanel
tbar:[
{
icon: 'images/icono_xcl.gif',
cls: 'x-btn-icon',
tooltip: 'Exportar a Excel',
listeners: { click: {fn: function (){
window.location.href = 'doc/netplanning/xls/exportar_excel_zona.php';
}}}},
{

icon: 'images/printer.png',
cls: 'x-btn-icon',
tooltip: 'Imprimir',
listeners: { click: {fn: function (){
window.tipo_print=1;
Ext.printPreview();
}}}}
]
},{
//se muestran la tabla
contentEl:'center_b',
title: 'Datos Provincia',
closable:false,
iconCls: 'datos',
autoScroll:true,
tbar:[
{
icon: 'images/icono_xcl.gif',
cls: 'x-btn-icon',
tooltip: 'Exportar a Excel',
listeners: { click: {fn: function (){
window.location.href = 'doc/netplanning/xls/exportar_excel_provincia.php';
}}}},
{

icon: 'images/printer.png',
cls: 'x-btn-icon',
tooltip: 'Imprimir',
listeners: { click: {fn: function (){
window.tipo_print=2;
Ext.printPreview();
}}}}
]
},
{
//se muestran la tabla
contentEl:'center_c',
title: 'Datos Bricks',
closable:false,
iconCls: 'datos',
autoScroll:true,
tbar:[
{
icon: 'images/icono_xcl.gif',
cls: 'x-btn-icon',
tooltip: 'Exportar a Excel',
listeners: { click: {fn: function (){
window.location.href = 'doc/netplanning/xls/exportar_excel_brick.php';
}}}},
{

icon: 'images/printer.png',
cls: 'x-btn-icon',
tooltip: 'Imprimir',
listeners: { click: {fn: function (){
window.tipo_print=3;
Ext.printPreview();
}}}}
]
}


As you can see I've got "window.tipo_print" defined and it takes differents values depending on the tab's buttom, but when I pass to "Ext.onPrinting(function()" and try to recover this variable it appears as undefined, what I want to do es to charge one or another data_store depending on the buttom the user pushes and I do not how to do it.

Thank u :)

Steffen Hiller
30 Apr 2008, 7:46 AM
Hey vizcano,

ok, now it's clear. I was thinking about this case the other day, too. Unfortunately your problem can not be solved with the current version, unless you extend the PrinterWindow class yourself. Remember that the print preview is loaded into an iframe, which is like a new window and therefore it doesn't know about the variables of the "parent" window. That's why window.tipo_print=2; has no effect.
Well, I'll add this functionality until this weekend, maybe today. If you don't want to wait, you have to extend the PrinterWindow class yourself for now. :-|

Regards,
Steffen

vizcano
30 Apr 2008, 8:14 AM
Hi!!

I'm afraid I'm too newbie to continue developing your code, anyway I'll take a look to the class. I hope someday i can program my own extensions as you do.

Thanks a lot :)

NoahK17
1 May 2008, 7:32 AM
Tagging for later use.

Cheers!

vizcano
4 May 2008, 11:33 PM
Hi

I've tried to continue developing your code, but as I said before I'm too newbie for it :s

Steffen Hiller
6 May 2008, 7:35 AM
Hi

I've tried to continue developing your code, but as I said before I'm too newbie for it :s
vizcano,

sorry, I didn't have time yet to continue working on the plugin, I hope soon though.

Steffen Hiller
6 May 2008, 7:37 AM
Hi,

Is your extension prevent browser to cut lines at the end of page ? or at least it prevent to cut letters ? (in some cases, last line is cutted at printing, this line become unreadable)
jelt,

what do you mean exactly? Do you have a screenshot? I think if you have a table, the browser puts the page break between two rows by default, not sure though.

jelt
6 May 2008, 7:47 AM
sorry for the previous annoying post, i deleted it but you have seen before, hehe...

In fact, if you put a table inside a div with position:absolute, (yes i know, it strange), then the browser begin to come crazy and the page break occurs sometime in the middle of a line !

So, i just removed the position absolute, and browser is healed :D

vladok
7 May 2008, 3:04 AM
http://extjs.com/forum/showthread.php?t=18435

Cheerz! I'm customizing this wonderful grid in the link. It would be great to implement PrinterFriendly plugin in it. I tried, but print preview is empty. Altogether is this kind of grid is supported by the plugin? Need your wisdom

Steffen Hiller
8 May 2008, 8:17 PM
http://extjs.com/forum/showthread.php?t=18435

Cheerz! I'm customizing this wonderful grid in the link. It would be great to implement PrinterFriendly plugin in it. I tried, but print preview is empty. Altogether is this kind of grid is supported by the plugin? Need your wisdom

Hey vladok,

well, the grid I see behind your link seems to be a normal GridPanel, so the PrinterFriendly extension should work with that. Well, check your code in the onPrinting part or post it here so I can take a look at it. Btw, when you call your page with _format=printerfriendly as query string parameter, you'll see the same result as in the (iframe) within your printer preview window.

Regards,
Steffen

Fabyo
9 May 2008, 2:19 AM
I love it that much plugin, but I wonder if you have to do work with datagrid with paging ?

thanks

Steffen Hiller
9 May 2008, 7:39 AM
I love it that much plugin, but I wonder if you have to do work with datagrid with paging ?

thanks

Hey Fabyo,

what do you exactly mean/what are you trying to achieve?
The normal case is, that you have a pagination toolbar on your normal screen grid, and that you display all data in the print grid/preview. In order to show all data, you have to load all your data in your data store.

Regards,
Steffen

Fabyo
9 May 2008, 9:22 AM
Thanks for return
I would like to use the plug in a datagrid which has paging example that:


http://extjs.com/deploy/dev/examples/grid/paging.html

but it did not work
you would not have an example using paging?

thanks

durlabh
14 May 2008, 1:51 PM
Hi Fabyo,

Can you please let me know what exactly are you looking for in paging-grid? Do you want to show all the records? If not, try placing attached files in grid folder and looking at "Printer" icon in the paging grid. At-least in IE 7, the print-out should be quite good.

I'm not using the extension mentioned in this thread. Rather, I'm using a separate extension I wrote.

Thanks!

margozzi
14 May 2008, 3:33 PM
I am having difficulty with IE. The below code snippet works perfectly in FireFox but dies in ext-all-debug.js when run in IE. I trie dto debug it but struggled with the IE tools. Again Firefox is superior. Anyway, here is my code.


function createPage( printPanel ){
myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
];

store = new Ext.data.SimpleStore({
fields: [
{name: 'company'},
{name: 'price', type: 'float'},
{name: 'change', type: 'float'},
{name: 'pctChange', type: 'float'},
{name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
]
});
store.loadData(myData);

columns = [
{id:'company',header: "Company", width: 160, sortable: true, dataIndex: 'company'},
{header: "Price", width: 75, sortable: true, renderer: 'usMoney', dataIndex: 'price'},
{header: "Change", width: 75, sortable: true, dataIndex: 'change'},
{header: "% Change", width: 75, sortable: true, dataIndex: 'pctChange'},
{header: "Last Updated", width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
];

printPanel = new Ext.ux.grid.PrinterGridPanel({
store: store,
columns: columns,
autoExpandColumn: 'company',
title: 'Array Grid'
});

var printWindow = window.open ('','Foo','status=1,toolbar=1,menubar=1,resizable=1,scrollbars=1,height=600,width=800');
printWindow.document.writeln( '<html><head><title>Print</title>' );
printWindow.document.writeln( '<script>');
printWindow.document.writeln( 'var ss = document.createElement("link"); ss.setAttribute("rel", "stylesheet");ss.setAttribute("type", "text/css"); ss.setAttribute("href", "/eem-app/resources/css/ext-all.css");document.getElementsByTagName("head")[0].appendChild(ss);');
printWindow.document.writeln( 'var ss = document.createElement("link"); ss.setAttribute("rel", "stylesheet");ss.setAttribute("type", "text/css"); ss.setAttribute("href", "/eem-app/resources/js/Ext.ux.PrinterFriendly/resources/css/printer-friendly.css");document.getElementsByTagName("head")[0].appendChild(ss);');
printWindow.document.writeln( 'var ss = document.createElement("link"); ss.setAttribute("rel", "stylesheet");ss.setAttribute("type", "text/css"); ss.setAttribute("href", "/eem-app/resources/css/logging.css");document.getElementsByTagName("head")[0].appendChild(ss);');
printWindow.document.writeln( '</script>');
printWindow.document.writeln( '</head><body><div id="test"></div></body></html>' );
printPanel.render( printWindow.document.getElementById('test'));
printWindow.document.close();
}

I am running with ExtJs 2.1. Seems to have nothing to do with PrinterFriendly specific code. Just GridPanel trying to render. The code used to have PrinterGridPanel, but I was trying to narrow it down.

Fabyo
15 May 2008, 1:57 AM
Thank you very much, I wish I could print all pages, for example have a datagrid with 3 pages, when I wanted for printing print all pages

thanks for example






Hi Fabyo,


Can you please let me know what exactly are you looking for in paging-grid? Do you want to show all the records? If not, try placing attached files in grid folder and looking at "Printer" icon in the paging grid. At-least in IE 7, the print-out should be quite good.

I'm not using the extension mentioned in this thread. Rather, I'm using a separate extension I wrote.

Thanks!

durlabh
15 May 2008, 5:33 AM
Hi Fabyo,

In your case, it is 2 step process - 1, you want to load all the records and then you want to print those records. One of the ways can be extending the plugin that I've created. Have a look at the attached code and it should help.

Thanks!

Fabyo
15 May 2008, 12:14 PM
I will try, then you Notice I made sure

Thanks! ;)

Edit.

I came to the conclusion that solve my problem I will have to send your query to the server and generate a datagrid with all the data without the layout to print all pages.

vladok
18 May 2008, 5:29 AM
Hey, it's me again. I'm working with:

http://extjs.com/forum/showthread.php?t=18435

EditorGrid

My problem is that I cannot get to my DataStore when onPrinting is called. For example I tried

Ext.onReady(myNameSpace.myModule.pri, myNameSpace.myModule, true);

and printing preview appeared


Ext.onPrinting(myNameSpace.myModule.pri, myNameSpace.myModule, true);

I get ds (my datastore) undefined





// This line should be included in all files in order to reference a local
// blank image (by default BLANK_IMAGE_URL = http://www.extjs.com)
Ext.BLANK_IMAGE_URL = 'scripts/extjs/resources/images/default/s.gif';

Ext.namespace('myNameSpace'); //define namespace with some 'name'

myNameSpace.myModule = function(){

var myPrivateVar = "I can be accessed only from within " +
"Ext.myNameSpace.myModule.";

// Private variables specific to this module
var colModel; //definition of the columns
var ds; //primary data store
var filters; //definition of filter plugin
var grid; //the grid component (object)
var myReader; //reader
var myRecordObj; //data record object
var pagingPlugin;//definition of paging plugin
var primaryKey='id';


var myPrivateMethod = function () {
Ext.log("I can be accessed only from within Ext.myNameSpace.myModule");
}


var setupDataSource = function(){


myRecordObj = Ext.data.Record.create([

{name: primaryKey},//this corresponds to 'companyID', I assigned a
{name: 'name', mapping: 'name', sortDir: 'ASC', sortType: 'asUCString'},
{name: 'surname'},
{name: 'code', type: 'float'},
{name: 'adress'}, //will use mapping='change'
{name: 'gsm', type: 'float'},
{name: 'work', type: 'date', dateFormat: 'Y-m-d'},
{name: 'phone', type: 'float'},
{name: 'notes'}
//again, the order shown here does NOT matter
]);


myReader = new Ext.data.JsonReader( //creates array from JSON response

{

root: 'results', //delimiter tag for each record (row of data)
totalProperty: 'total',//element containing total dataset size (opt
id: primaryKey //used several times so a Private Variable is used

},
myRecordObj//pass a reference to the object
);


ds = new Ext.data.GroupingStore({ //if grouping

proxy: new Ext.data.HttpProxy({
url: 'ajaxyo/getuserdata', //url to data object (server side script)
method: 'POST'
}),
baseParams:{task: "readStock"},//This parameter is passed for any
storeId:"ClientDataStore",
reader: myReader,
sortInfo:{field: 'name', direction: "ASC"}
//remoteSort: true,//true if sort from server (false = sort from cache only)
});//end ds



};//end setupDataSource


var getColumnModel = function(){
if(!colModel) { //only need to create columnModel if it doesn't already exist


function renderDate(value){
//Ext.util.Format.dateRenderer('m/d/Y')
return value ? value.dateFormat('Y-m-d') : '';
};


function italic(val){
return '<i>' + val + '</i>';
};



var colModel = new Ext.grid.ColumnModel([ //instantiate ColumnModel

{
/*optionally specify the aligment (default = left)*/
align: 'right',
dataIndex: 'id',
header:'ID',//header = text that appears at top of column
sortable: true,//false (default) disables sorting by this column
width: 9 //column width
},{
align: 'right',//default is to align to the left
dataIndex: 'name',
header: "Name",
sortable: true,
width: 12,
editor: new Ext.form.TextField({
//specify options
allowBlank: false //default is true (nothing entered)
})


},{
align: 'right',
dataIndex: 'surname',
header: "Surname",
sortable: true,
width: 12,
editor: new Ext.form.TextField({
//specify options
allowBlank: false //default is true (nothing entered)
})
},{
align: 'center',
dataIndex: 'code',
header: "Code",
//custom renderer specified by reference:
editor: new Ext.form.TextField({
//specify options
allowBlank: false //default is true (nothing entered)
}),
sortable: true,
width: 12
},{
dataIndex: 'adress',
header: "Adress",

sortable: true,
width: 15,
editor: new Ext.form.TextField({
//specify options
allowBlank: false //default is true (nothing entered)
})
},{
dataIndex: 'work',
header: "Last Updated",
renderer: renderDate,
sortable: true,
width: 20,
editor: new Ext.form.DateField({ //DateField editor
//specify options

//allow to leave blank? default is true (allow blanks)
allowBlank: false,

disabledDaysText: 'Closed on this day'
})
},{
align: 'center',
dataIndex: 'gsm',
header: "GSM",
editor: new Ext.form.TextField({
//specify options
allowBlank: false //default is true (nothing entered)
}),
sortable: true,
width: 8
},

//this column is passed in by reference (see above)
// checkColumn

]);//end colModel


this.filters = new Ext.ux.grid.GridFilters({
//need to specify if want local filtering (filter the store),
//otherwise defaults to server side filtering
local:true,//specify true if you want to filter client side

filters:[
{dataIndex: primaryKey, type: 'numeric'},
{dataIndex: 'name', type: 'string'},
{dataIndex: 'surname', type: 'string'},
{dataIndex: 'code', type: 'numeric'},
{dataIndex: 'adress', type: 'string'},
{dataIndex: 'work', type: 'date'},
{dataIndex: 'gsm', type: 'numeric'},
{dataIndex: 'phone', type: 'numeric'},

{dataIndex: 'check', type: 'boolean'}
]
});//end filters setup

this.pagingPlugin = new Ext.ux.Andrie.pPageSize({
afterText: 'records at a time'
});

}//end if colModel

return colModel;//if colModel already exists return it

}//end getColumnModel


var buildGrid = function(){


function addRecord() {
var r = new myRecordObj({
//specify default values

//will use this to trigger special handling when updating
id: 0,
name: '',
surname: 0.00,
code: 0,
adress: 0,
gsm: 0,
work: new Date(),
notes: '',
phone: 0
});
grid.stopEditing();//stops any acitve editing
ds.insert(0, r); //1st arg is index,
grid.startEditing(0, 1);
}; // end addRecord


function deleteRecord(btn) {
if(btn=='yes')
{

var selectedRows = grid.selModel.selections.items;
var selectedKeys = grid.selModel.selections.keys;
var encoded_keys = Ext.encode(selectedKeys);
//submit to server
Ext.Ajax.request( //alternative to Ext.form.FormPanel? or Ext.BasicForm.submit
{ //specify options (note success/failure below that receives these same options)
waitMsg: 'Saving changes...',
//url where to send request (url to server side script)
url: 'ajaxyo/getuserdata',

//params will be available via $_POST or $_REQUEST:
params: {
task: "delete", //pass task to do to the server script
id: encoded_keys,//the unique id(s)
key: primaryKey//pass to server same 'id' that the reader used
},

callback: function (options, success, response) {
if (success) { //success will be true if the request succeeded
Ext.MessageBox.alert('OK',response.responseText);//you won't see this alert if the next one pops up fast
var json = Ext.util.JSON.decode(response.responseText);


Ext.MessageBox.alert('OK',json.del_count + ' record(s) deleted.');


} else{
Ext.MessageBox.alert('Sorry, please try again. [Q304]',response.responseText);
}
},

//the function to be called upon failure of the request (server script, 404, or 403 errors)
failure:function(response,options){
Ext.MessageBox.alert('Warning','Oops...');
//ds.rejectChanges();//undo any changes
},
success:function(response,options){
//Ext.MessageBox.alert('Success','Yeah...');
//commit changes and remove the red triangle which
//indicates a 'dirty' field
ds.reload();
}
} //end Ajax request config
);// end Ajax request initialization
};//end if click 'yes' on button
}; // end deleteRecord




function handleDelete() {

//returns array of selected rows ids only
var selectedKeys = grid.selModel.selections.keys;
if(selectedKeys.length > 0)
{
Ext.MessageBox.confirm('Message','Do you really want to delete selection?', deleteRecord);
}
else
{
Ext.MessageBox.alert('Message','Please select at least one item to delete');
}//end if/else block
}; // end handleDelete

function refreshGrid() {
ds.reload();//
}; // end refresh

function getidentity() {
var m = grid.getSelections();


console.log(Ext.getCmp('ClientGrid').getColumnModel());
store2 = Ext.StoreMgr.lookup("ClientDataStore");
store = Ext.StoreMgr.lookup('DataStoreWork');

var idd = m[0].get('id');
store.filter('nr',/([1])/);

Ext.getCmp('WorkGrid').getSelectionModel().selectFirstRow();
// console.log(store.getCount());
//
// console.log(Ext.getCmp('WorkGrid'))


}




function handleEdit(editEvent) {
//determine what column is being edited
var gridField = editEvent.field;

//start the process to update the db with cell contents
updateDB(editEvent);


}




function updateDB(oGrid_Event) {


if (oGrid_Event.value instanceof Date)
{ //format the value for easy insertion into MySQL
var fieldValue = oGrid_Event.value.format('Y-m-d');
} else
{
var fieldValue = oGrid_Event.value;
}

//submit to server
Ext.Ajax.request( //alternative to Ext.form.FormPanel? or Ext.BasicForm
{ //Specify options (note success/failure below that
//receives these same options)
waitMsg: 'Saving changes...',
//url where to send request (url to server side script)
url: 'ajaxyo/getuserdata',

//If specify params default is 'POST' instead of 'GET'
//method: 'POST',

//params will be available server side via $_POST or $_REQUEST:
params: {
task: "update", //pass task to do to the server script
key: primaryKey,//pass to server same 'id' that the reader used
keyID: oGrid_Event.record.data.id,
field: oGrid_Event.field,//the column name
value: fieldValue,//the updated value

originalValue: oGrid_Event.record.modified

},//end params

//the function to be called upon failure of the request
//(404 error etc, ***NOT*** success=false)
failure:function(response,options){
Ext.MessageBox.alert('Warning','Oops...');
//ds.rejectChanges();//undo any changes
},//end failure block

//The function to be called upon success of the request
success:function(response,options){
//Ext.MessageBox.alert('Success','Yeah...');


//if this is a new record need special handling
if(oGrid_Event.record.data.id == 0){
var responseData = Ext.util.JSON.decode(response.responseText);//passed back from server

//Extract the ID provided by the server
var newID = responseData.newID;
//oGrid_Event.record.id = newID;

//Reset the indicator since update succeeded
oGrid_Event.record.set('newRecord','no');

//Assign the id to the record
oGrid_Event.record.set('id',newID);

ds.commitChanges();

//var whatIsTheID = oGrid_Event.record.modified;

//not a new record so just commit changes
} else {
//commit changes (removes the red triangle
//which indicates a 'dirty' field)
ds.commitChanges();
}
}//end success block
}//end request config
); //end request
}; //end updateDB


grid = new Ext.grid.EditorGridPanel({ //to instantiate editor grid
autoExpandColumn: 'name', //which column to stretch in width to fill up the grid width and not leave blank space
//autoSizeColumns: true,//deprecated as of Ext2.0
clicksToEdit:2,//number of clicks to activate cell editor, default = 2
colModel: getColumnModel(), //gets the ColumnModel object to use (cm: is shorthand)
height:350,//you must specify height or autoHeight
iconCls: 'icon-grid',//we create our own css with a class called 'icon-grid'
id: 'ClientGrid',//unique id of this component (defaults to an auto-assigned id).
loadMask: true,//use true to mask the grid while loading (default = false)
plugins:[this.filters],//object or array of objects (filters = enable filtering of records)
//plugins: filters,//example with just one plugin
//Enable a Selection Model. The Selection Model defines the selection behavior,
//(single vs. multiple select, row or cell selection, etc.)
selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),//true to limit row selection to 1 row})
store: ds, //the DataStore object to use (ds: is shorthand)
stripeRows: true,//applies css classname to alternate rows, defaults to false
title:'This is the Grid Title',
//trackMouseOver: true,//highligts rows on mousever (default = false for editor grid)
width:740,

bbar: new Ext.PagingToolbar({

plugins: [this.pagingPlugin, this.filters],
pageSize: myNameSpace.myModule.perPage,//default is 20
store: ds,
displayInfo: true,//default is false (to not show displayMsg)
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No data to display",//display message when no records found
items:[
'-', {
pressed: true,
enableToggle:true,
text: 'Show Preview',
cls: 'x-btn-text-icon details'

}]
}),
//Add a top bar
tbar: [
{
text: 'Add Record',
tooltip: 'Click to Add a row',

//We create our own css with a class called 'add'
//.add is a custom class not included in
// ext-all.css by default, so we need to define the
// attributes of this style ourselves
iconCls:'add',
handler: addRecord //what happens when user clicks on it
}, '-', //add a separator
{
text: 'Delete Selected',
tooltip: 'Click to Delete selected row(s)',

//function to call when user clicks on button
handler: handleDelete,
iconCls:'remove'
}, '->', // next fields will be aligned to the right
{
text: 'Refresh',
tooltip: 'Click to Refresh the table',
handler: refreshGrid,
iconCls:'refresh'
}
],

//this is the key to showing the GroupingStore
view: new Ext.grid.GroupingView({
forceFit:true,
//custom grouping text template to display the number of
//items per group
groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
})
});//end grid


grid.addListener('afteredit', handleEdit);//give event name, handler (can use 'on' shorthand for addListener)

grid.on('rowdblclick', getidentity);


}//end function buildGrid



var renderGrid = function() {
grid.render('grid-company');//1st argument is the container,
//2nd argument is the position within
//the div (end of the container is default)

/**
* Grid rendering effects
* if we want to render rows depending on values in row
*/



};//end function renderGrid



var loadStore = function() {

ds.load({
params: { //this is only parameters for the FIRST page load,
//use baseParams above for ALL pages.
start: 0, //pass start/limit parameters for paging
limit: myNameSpace.myModule.perPage//
}
});

grid.getSelectionModel().selectFirstRow();

};//end loadStore


var loadPrinter = function(){
columns = [
{id:'id',header: "id", width: 160, sortable: true, dataIndex: 'id'},
];

// Add stylesheet that get's applied when you open your print preview (and when printing your page)
Ext.addStyleSheet("printer-friendly.css");
// Or use Ext.util.CSS.swapStyleSheet( String id, String url ) to remove (via id) and add a new StyleSheet
// Don't forget to set the state manager, if you want to remember the state for your columns in the printer friendly view (hidden, order, sorting)
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
console.info(ds);
new Ext.Panel({
renderTo: "body",
layout: "table",
layoutConfig: {
columns: 1
},
border: false,
bodyBorder: false,
items: [
new Ext.BoxComponent({
el: 'description'
}),

// Special PrinterGridPanel which is optimized for performance for printing large data sets,
// and which shows all rows (since you can't scoll on paper)
new Ext.ux.grid.PrinterGridPanel({
store: ds,
columns: columns,
stateId: 'ClientGrid',

title: 'Array Grid'
})
]
});

}


///////////////////////////////////////////////////////////////////////////
//-----------------------------------------------------------------------//
//------------------------------Public Area------------------------------//
//-----------------------------------------------------------------------//
///////////////////////////////////////////////////////////////////////////

return {//returns an object=myNameSpace.myModule with the following
//properties:
// Example of Public Property (just an example; not needed for the grid
myPublicProperty: "I'm accessible as myNameSpace.myModule.myPublicProperty.",
//To reference this property use:
// this.myPublicProperty (while inside the Public Area)
// myNameSpace.myModule.myPublicProperty (when outside of the
// module)
getGridCM: function(){ return Ext.getCmp("ClientGrid").getColumnModel() },
// Public Properties specific to this module
perPage: 10, //page limit



///////////////////////////////////////////////////////////////////////////
//-----------------------------Public Methods----------------------------//
///////////////////////////////////////////////////////////////////////////


//Initialization Method
init : function(){

Ext.ux.grid.filter.StringFilter.prototype.icon = 'images/find.png';

// get our Grid (remember, 'this' refers to properties and methods
// inside the public area
this.getMyGrid();

//Works without this, used for state awareness...
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

},//end of init method

pri : function(){

loadPrinter();

},
getMyGrid: function() {

Ext.QuickTips.init();//Enable Quicktip
setupDataSource(); //Setup the Data Source
buildGrid(); //Build the Grid
renderGrid(); //Render the Grid
loadStore(); //Load the Store

},



//Method to check what is in our Data Store
//You might call this method fromt he firebug console for example
getDataSource: function() {
return ds;
}




}//end of return

//------------------------------Public Area------------------------------//
//-----------------------------------------------------------------------//
///////////////////////////////////////////////////////////////////////////

}();




Ext.onReady(myNameSpace.myModule.init, myNameSpace.myModule, true);
Ext.onPrinting(myNameSpace.myModule.pri, myNameSpace.myModule, true);

vizcano
19 May 2008, 12:45 AM
Hi any news about sending a different grid depending on selection? :)

Steffen Hiller
19 May 2008, 1:15 PM
Hey, it's me again. I'm working with:

http://extjs.com/forum/showthread.php?t=18435

EditorGrid

My problem is that I cannot get to my DataStore when onPrinting is called. For example I tried

Ext.onReady(myNameSpace.myModule.pri, myNameSpace.myModule, true);

and printing preview appeared


Ext.onPrinting(myNameSpace.myModule.pri, myNameSpace.myModule, true);

I get ds (my datastore) undefined


Hi vladok,

by the nature of the extension, when the user opens the print preview, only the Ext.onPrinting gets executed, not the Ext.onReady part.
Your myNameSpace.myModule.pri method only calls loadPrinter() which doesn't call/load your data store or your column model.
So your pri() method should look something like your getMyGrid() method looks:



pri: function() {
setupDataSource(); //Setup the Data Source
loadPrinter();
loadStore(); //Load the Store
},


Regards,
Steffen

Steffen Hiller
19 May 2008, 1:20 PM
Hi any news about sending a different grid depending on selection? :)

Hi vizcano,

sorry, I haven't had the need in my project yet :-| I'm pretty full right now with (paid) work. If you really need that feature, I could offer you paid support. Should take me around an hour to implement this. PM me for details.

Regards,
Steffen

Steffen Hiller
19 May 2008, 1:25 PM
I will try, then you Notice I made sure

Thanks! ;)

Edit.

I came to the conclusion that solve my problem I will have to send your query to the server and generate a datagrid with all the data without the layout to print all pages.

Hi Fabyo,

sorry, I didn't look into the forum lately.
I'm still not completely understanding where you are having problem using my extension to accomplish your requirement. Just use my PrinterGridPanel and load ALL data into your store. That was actually a "core requirement" of the extension to enable printing of paginated grids.

Regards,
Steffen

vladok
19 May 2008, 11:55 PM
Thanks, indeed it was the problem with onReady!

But can I write some data form another grid into print preview.
document.write(); wasn't such a good idea. It erased the printing grid and all other info.

Fabyo
20 May 2008, 11:56 AM
Hi Steffen

my question is that the paging there any data on the page, as they are in the server, I believe that I may have to print everything mandar a query to the server and thus return all the data and not only the limit of 30, I understood what does your script and liked a lot, but in my need to print it all at once pages, for example if there is 4 pages order prints he prints all 4 at once

thank you very much

vladok
20 May 2008, 1:48 PM
...still fighting... :)



function getidentity() {
var m = grid.getSelections();
store = Ext.StoreMgr.lookup('DataStoreWork');
filt = m[0].get('id');
console.info(filt);
store.filter('nr',filt);
Ext.getCmp('WorkGrid').getSelectionModel().selectFirstRow();
return filt;

}

grid.on('rowclick', getidentity);



Than I want to pass filt to:

Ext.onPrinting(function() {test(filt)});

So tha my printing panel would be also filtered. But as I understand onprinting reloads the page and the variable filt, so it becomes empty... I'm getting filt from event onrowclick, so it is dynamic and I cannot assign it a value. What should I do?

immu2k1
22 May 2008, 6:17 AM
Hi Folks,

Not sure if others are seeing this also, but I'm getting the following error in Firebug when viewing the example that is included with version 0.2:



Ext.ux.PrinterFriendly has no properties
Ext.js()Ext.js (line 14)
[Break on this error] Ext.ux.PrinterFriendly.getHtml = function() {


The page renders fine and the printer friendly popup page renders fine too, but the above error is shown in Firebug when loading the main grid page.

Anyone else getting this?

Thanks

immu2k1
22 May 2008, 6:47 AM
This is resolved now. The examples html was including Ext.js and init.js also had a dynamic include for Ext.js. The duplicate includes seemed to cause the warning.


Hi Folks,

Not sure if others are seeing this also, but I'm getting the following error in Firebug when viewing the example that is included with version 0.2:



Ext.ux.PrinterFriendly has no properties
Ext.js()Ext.js (line 14)
[Break on this error] Ext.ux.PrinterFriendly.getHtml = function() {


The page renders fine and the printer friendly popup page renders fine too, but the above error is shown in Firebug when loading the main grid page.

Anyone else getting this?

Thanks

NoahK17
27 May 2008, 8:30 AM
The issue I am having is this, according to FireBug:


ct is null
[Break on this error] this.el = ct.createChild({

It has to do with the renderTo code, under onPrinting(). I'm guessing renderTo:'body' does not exist somehow?

Maybe I'll try opening up an entirely new window, which was discussed a few pages back.

vladok
28 May 2008, 12:42 AM
hi! Is there any way to get a variable from my js code inside onPrinting function?

rkan
28 May 2008, 3:37 AM
Hi NoahK17,

Try this: <body id='body'> on the html page body tag.

NoahK17
28 May 2008, 6:39 AM
In my index.html, I have the following tag:


<body scroll="no" id="docs">

My onPrinting() function looks like this...



Ext.onPrinting(function(){
...
new Ext.Panel({
renderTo: "docs",
layout: "table",
layoutConfig: {
columns: 1
},
border: false,
bodyBorder: false,
items: [
new Ext.BoxComponent({
el: 'description'
}),

new Ext.ux.grid.PrinterGridPanel({
store: store,
columns: cm,
stateId: 'array-grid',
title: Ext.getCmp('locProCarGridPanelExample').title
})
]
});
});


And the error I get is...


this.el is null
[Break on this error] ct.dom.insertBefore(this.el.dom, position);

I am using a Viewport layout, would that matter at all? When the PrinterWindow is created, it is given the id of "printer-window" -- does it make a difference that the window is an iFrame overlay of my main index.html page? Do I need to use a different renderTo tag?

Any help is greatly appreciated :)

superFly77
12 Jun 2008, 9:31 AM
Hi, im trying to use this extension inside of an IframePanel

I have got it so that all the right files load up and when I click my Print button the preview window shows up, However my onPrinting function is not firing and it seems a default onPrinting is running that just has the body of the page (no grid).

Here is how the code is setup


Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
//My store/coloums/grid
//I have a tbar on the grid with the following button for print
tbar:[
{
text:'Print List',
iconCls:Ext.ux.TDGi.icons.icn_printer,
handler : function(){
Ext.printPreview();
}
}
]
//Using this viewport
viewport = new Ext.Viewport({
layout:'fit',
listeners:{
single : true},
items:[grid]});viewport.doLayout();

});
Ext.onPrinting(function(){
//
});

Right now the onPrinting is not firing at all. The preview panel loads up tho..but my onPrinting is not running.

Thanks for any help.

dorgan
18 Jun 2008, 10:12 AM
I am getting the following error and everything seems to be including properly.

Ext.ux.grid is undefined

Steffen Hiller
18 Jun 2008, 10:19 AM
I am getting the following error and everything seems to be including properly.

Ext.ux.grid is undefined

Hey drogan, in what line does this error occur and what browser you are using?
Did you set the Ext.ux.PrinterFriendly.ROOT constant in the config.js file accordingly?

Regards,
Steffen

nebbian
22 Jul 2008, 9:03 PM
My project heavily uses ajax, loads lots of different windows in many different tabs, and I needed a way to print just the information I wanted from wherever the button happened to be. The problem with this code was that it loads up whatever's in the address bar, instead of the content inside a nested tabPanel...

The way I got around this was to set the URL of the print window like this:


<p id="print-toolbar"><a href="#" onClick="Ext.printPreview({iframeSrc:function(){return '/url/to/show/in/print/preview.htm?_format=printerfriendly'}});">Print this page</a></p>


I hope this helps someone.

fangzhouxing
23 Jul 2008, 1:39 AM
I try the 0.2 version, and get error msg:

Ext.onPrinting is not a function

Why? Thanks in advance.

extjs newbie
28 Jul 2008, 11:37 PM
I habe the same problem. Is a solution available?

pryakumar
5 Sep 2008, 12:30 PM
Hi Steffen Hiller,
when i try to run the exaample you have given in the attachement. i have not able to see the proper output in the print preview page. Is any setting i have missed ?

Please find the screen shot attachment printissue.gif file.

Steffen Hiller
5 Sep 2008, 12:39 PM
Hmm, can you check it in firefox with firebug to see if it shows a more helpful error message?
You should only need to set the path in the config.js file.

Btw, here's a newer version: http://github.com/steffen/ext.ux.printerfriendly/tree/master
It won't solve the problem, but just as an info.



Hi Steffen Hiller,
when i try to run the exaample you have given in the attachement. i have not able to see the proper output in the print preview page. Is any setting i have missed ?

Please find the screen shot attachment printissue.gif file.

nerdydude81
8 Sep 2008, 5:45 AM
Wish I would have found this before I wrote this

http://extjs.com/forum/showthread.php?t=44885

Can't wait for a centralized ux repository.

mystix
8 Sep 2008, 11:41 PM
Wish I would have found this before I wrote this

http://extjs.com/forum/showthread.php?t=44885

Can't wait for a centralized ux repository.

http://extjs.com/forum/showthread.php?t=43450 (the thread is stickied, btw)
knock yourself out.

GISSOT
12 Sep 2008, 1:16 AM
Hi,
I've tried your example and your plugin is very good!
(sorry for my english...)
But I would display (and print) column's titles. How can I do that?

gcleaves
23 Sep 2008, 5:47 AM
First off, thanks for this useful extension.

A strange thing happens when my print preview appears onscreen in both FF 3 and IE 7. The table briefly appears normally then the cells lose their alignment and the data all runs together. See screen print. When I actually print in IE, however, it's ok. I'd like the preview to appear correctly so users don't panic. In FF printing does not work. First page is blank and printing ends after second page when there is still much more that should be printed.

Additionally, How can I get column headers to print?

botgv
24 Sep 2008, 2:03 AM
Hi
Thank you very much for this very usefull ExtEnsion

For thoose who haven't headers displayed with ExtJs 2.2 I give the trick i used to correct this incompatibility.

Had the folowing method to the printerGridView class defined in printerGridView.js



afterRender : Ext.emptyFn, // disabled method

crebegea
26 Sep 2008, 3:41 AM
I used Ext.ux.PrinterFriendly to make a report. It's great extension. Though I ran into a problem: the PrinterGridPanel object appears on the preview panel but it has no values.
If I do a store load than the data appears. This is fine, but the parameters sent in the Post do not include the settings that I do in a previous form, so it's not the correct data.

The problem is that from the onPrinting method I do not have any access at this selection form, though there isn't any page reload in between, only the preview panel render and associated Iframe.
The selection form is declared and rendered on the onReady method from the same js module.
More strange is that after all print preview is loaded I can find this object from Firebug console, but not from any other method inside the preview panel. Can someone help me?


Ext is probably the best ! ...

crebegea
26 Sep 2008, 4:10 AM
Ok, problem solved. You have to use CookieProvider for this.
Funny is, I had already tried, but made some stupid typo :D.

chuckdev
29 Sep 2008, 12:21 PM
Hi,

I just download 0.2 and try to test it but i received "Ext.onPrinting is not a function" in firebug. I use extjs2.1, FF3, IE7

I edited config.js and printer-friendly-array-grid.html

I put some alert in config.js and init.js to see if it was loading and it display the alert.

So, did I miss something to have this error?

thanks!


[UPDATE]
ok I found the cause of the my error "Ext.onPrinting is not a function"!
SOLUTION: I must not run printer-friendly-array-grid.html directly. Must pass throught a webserver: http://localhost:8080/.../printer-friendly-array-grid.html

anortje
10 Oct 2008, 10:29 AM
Hi Steffen, the zip's seem to be corrupt. I'm downloading to a Windows XP workstation. Are they still ok?

TIA
Andrew

Steffen Hiller
10 Oct 2008, 11:40 AM
anortje,

the zip files aren't up to date anymore anyway. Sorry, I missed to update the first thread post. The latest source is now on github, see the first post for details:
http://extjs.com/forum/showthread.php?t=31524

Is the zip with the 0.2 example working at least? Because, these aren't in the git repository.

Regards,
Steffen


Hi Steffen, the zip's seem to be corrupt. I'm downloading to a Windows XP workstation. Are they still ok?

TIA
Andrew

coderspool
29 Oct 2008, 1:22 AM
I am using extjs in a java application and trying to print a grid

I tried using the method specified here

http://extjs.com/forum/showthread.php?t=35520

But since the grid had so many records, while printing only the final page got printed , other pages came blank.Upon removing all the sylesheet in the printpreview.htm mentioned in that thread , we got whole data but alignment was all gone

Now i am going to implement this method

http://extjs.com/forum/showthread.php?t=31524

But the example attachment (zip file) is corrupt. Any of you have an working example for gird? if possible please post

Also any other alternatives?

Thanks

mystix
29 Oct 2008, 1:43 AM
download with firefox instead of IE.

willbelair
28 Nov 2008, 6:34 AM
Hi,
First, thanks for all the hard work all of you have done.
I am trying to do the same thing, and found that the plugin is useful, except I cannot use in my case. I have a pannel with tree and tabs, each tab contains a grid. And user has to login to use the system. When calling the printfunction, it open a new page and here comes the problem, the error message is authetication failed.
Could someone give me some help or a hint how to solve that? Thank you

Steffen Hiller
28 Nov 2008, 6:43 AM
Hi willbelair,

check the url of the new page. The plugin by default opens the current page with only appending ?/&_format=printerfriendly to the query string.

willbelair
28 Nov 2008, 7:27 AM
thank you Steffen. The url of new page is the same as the current. I have the title: Print Preview, the Close / Print buttons (works well), and the error message: Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in localhost\login.php on line 22
{success: false, errors: { reason: 'Login failed. Try again.' }}

Also, I use php and mysql on apache. If I use another plugin : http://extjs.com/forum/showthread.php?t=35520 , I will not get this type of error, and of course, I have to deal with another problem. And frankly, this plugin is more functioning. If you have any idea of how to get this straigth, please advise.

Thank you.

willbelair
28 Nov 2008, 8:57 AM
I think I found out why it does not work, reason is in my application, each user has different view of the objects (tree, tabs.... grid - grid columns), so, for each user, I need to create a new js file on the fly, which holds user's info. And for the new popup window, the user's info is not passed along. I think there should be a way to do that, or I have to review my app process.
Thank you for your help

zhw511006
28 Nov 2008, 6:28 PM
where is the function? Ext.printPreview() And Ext.onPrinting()
Error IE7: object can't support this function
thank you!

willbelair
30 Nov 2008, 7:23 PM
Hi,
The problem that I am facing is the tree structure in the panel. As I mentioned, my app includes a tree and grids which response to the tree leaves. When calling the printing function,
1- the url is just the original url with the # appended.
2- in Firefox and IE, nothing displayed, and the error message is


ct is null
[Break on this error] this.el = ct.createChild({

when clicking print preview ( in the browser menu) Firefox shows nothing, but IE shows data of the grid, and the tree as well

So, I guess, the function got stuck at understanding the tree structure, which I think it should not touch. Please correct me if I am wrong. And hope that you have some solution for this.

Thank you

labgear
5 Dec 2008, 12:43 PM
Greetings,

I am using extjs_printergrid_0.0.1.js inconjuction with a paging grid and Ext.ux.grid.GridSummary.js plugin.

I need to be able to pick up the count and sum fields provided by the gridsummary and include it in the print out of the grid, does anyone have a an exsample of how this can be done?

Rafael
15 Dec 2008, 7:39 PM
i use this Plugin, but have a error :



Ext.onPrinting is not a function
http://localhost:8090/imprimir/printer-friendly-array-grid.js
Line 189


why this error ?

ngoswamy
12 Jan 2009, 1:12 AM
Hi,

I have a slightly modified version of Print Grid. I am displaying the Print Grid in a Panel instead of using the iframe route. It's working fine in Firefox 2 & 3 but in IE the Panel shows all the grid rows in a single line that wraps around. Also I am not getting the row headers. The Print grid is similar to the one shown in the example you have provided.

greetings,
nj

wwwtd
12 Jan 2009, 11:54 PM
Hey vizcano,

did you set the Ext.PRINTER_FRIENDLY_CSS_URL constant in your ux.PrinterFriendly/init.js file? That css is important for exactly your problem.

Regards,
Steffen
hi

wwwtd
13 Jan 2009, 1:00 AM
why I run in ff3 and IE6 it work not good

Dr. Flink
27 Jan 2009, 3:58 AM
Is there a way to get the selected records from the "original grid"?

I tried this after selecting x rows in the grid, but the alert prints 0:


Ext.onPrinting(function() {
alert(Ewa.Article.sm.getCount()); //sm = selection model, declared public inside Ewa.Article
...
...
});
I also tried setting scope to Ewa.Article with no result.

The reason is that I only want to print selected rows from grid.

// Best regards

hlimaiem
27 Jan 2009, 11:34 PM
Hi,
I've tried to print a grid with Ext.ux.PrinterFriendly-Example-0.2, i've done all the configurations required for this, the print preview appear but it's all blank.
my grid appear normally, but the print preview appears blank (no data shown in the print preview) also when i try to print the from the preview i've got a blank table.
Does anybody can give me help to resolve this problem.
Thank you

file:///C:/DOCUME%7E1/heykel/LOCALS%7E1/Temp/moz-screenshot-1.jpgfile:///C:/DOCUME%7E1/heykel/LOCALS%7E1/Temp/moz-screenshot-2.jpg

astat
3 Feb 2009, 2:28 AM
Hi, Steffen.

i have a problem with printing GroupingStore...
you plan to make version 0.3?

10x
Igor

wwwtd
5 Feb 2009, 1:57 AM
Hi, Steffen.

i have a problem with printing GroupingStore...
you plan to make version 0.3?

10x
Igor
I want to know too.
When I use 0.2 there are many problems such as after grid was print preview,I press grid reload .it doesn't work fine,it show Ext is not define;
can anyone tell me why? and it has so many problems........

jhatlanta
10 Feb 2009, 7:31 AM
Hi,

Thanks for an extremely useful extension and the hard work you've put into this...

We're beginning to look into grid printing, and this one looks promising (we'd prefer that printing not make a roundtrip to the server to get the data, but that's something we might be able to work around or change the requirements for...)

I've not yet tried to use this extension, but I have read the messages in this thread and the extension About page. I have a couple of questions regarding the feature set:

- Has grouping support been added yet?
- If a cell contains a custom renderer, will it present a problem? I'm thinking of cases where the renderer function relies on some external data, such as a second data store, global variables, etc., that may or may not be defined in a separate .js file.

Thanks!

Steffen Hiller
10 Feb 2009, 10:50 AM
Hi all,

the extension is not supporting grouping view yet. I haven't needed it yet and probably won't need it in the near future.
I can add this feature in form of paid support, though.


If a cell contains a custom renderer, will it present a problem? I'm thinking of cases where the renderer function relies on some external data, such as a second data store, global variables, etc., that may or may not be defined in a separate .js file.

Cell renderer should basically work fine. Not sure about your special case, though.

Cheers,
Steffen

jhatlanta
10 Feb 2009, 11:53 AM
Hi all,

the extension is not supporting grouping view yet. I haven't needed it yet and probably won't need it in the near future.
I can add this feature in form of paid support, though.



Cell renderer should basically work fine. Not sure about your special case, though.

Cheers,
Steffen

Thanks for the quick response! We'll look into this soon.

sree
24 Feb 2009, 3:16 AM
Hi

Is it possible to print a panel containing form,combo,grid as items using Ext.ux.PrinterFriendly Extension. Below code is part of my js .

var displayPanel = new Ext.Panel({
autoScroll : true,
frame: true,
align:'center',
collapsible: true,
height:650,
// autoHeight:true,
width:1000,
layout:'column',
items: [headForm,searchForm,comboForm,grid] }) ;




var viewport = new Ext.Viewport({
layout:'border',

items:[
{
region: 'center',
// el: 'center1',
deferredRender:false,
labelAlign: 'top',
frame:true,
margins: '0 0 0 80',
// bodyStyle:'padding:5px 5px 0',
// width: 600,
layout:'fit',
items:[displayPanel]
}
]
});

If its possible how can i declare that in Ext.onPrinting.

Thank You
Jayasri

hash_man
21 Mar 2009, 8:00 PM
When I open the page,firebug always told me Ext.onPrinting is not a function.Why?

alindsay55661
23 Mar 2009, 2:18 PM
How much do you charge to add support for the grid filter plugin made by ambience?

http://extjs.com/forum/showthread.php?t=14503&highlight=search+grid+sort

alindsay55661
23 Mar 2009, 2:22 PM
And for that matter the grouping store as well.

alindsay55661
24 Mar 2009, 4:33 PM
I cannot get the grid state to restore when printing. I typically load my content via ajax calls. However, I manually construct the url of the print view by going to a new page and appending the param as you describe. Everything works perfectly except the state restore. Is there something special I need to do to restore the grid state?

yegortitov
3 Apr 2009, 7:30 AM
Hi,

like other people, i have this error when i run the html file, in my localhost (php)



Ext.onPrinting is not a function


The file who contents the error is obviulsy printer-friendly-array-grid.js

Thanks for help

ReeRun
8 Apr 2009, 12:12 AM
@Yegortitov: I had the same problem. I solved it by entering an absolute path in config.js (from the base URL, e.g. /web/ext/...). The code dynamically adds a few lines in your <head> section. If the path isn't correct, the JS won't load.

@steffen:
I have a quirk in firefox. After closing the print preview my scrollbar has disappeared. May not have to do with your coding, but I thought I'd just mention it anyway.

Something odd has come up: when the iframe is opened with the _format=... directive, the iframe goes black (well, dark to be more precise). Content is loaded, but nothing is shown. If I remove the directive, everything is normal... Well, except that I can't get your plug in to work, but that's probably because of my 'inexperience-ness' with ExtJs and your plug in.

王威
22 Apr 2009, 5:47 AM
有没有效果的图片啊,老外怎么都不喜欢发截图呢

powellm1976
23 Apr 2009, 11:42 AM
Hey! Thanks for the great work you've done! I've been able to do some pretty cool stuff with this!

I have ran into an issue I can't figure out. I have a page that has two tables on it. Both tables are coming up fine and I can see each tables print icon above the table. When I click on the print icon from table 1 or table 2, the print preview is always the data from table 1.

How can I have the print icon print that table's data. If I click on table 2, I want the Print Preview to be table 2's data.

Thanks for the help!!!

mark

Steffen Hiller
23 Apr 2009, 12:06 PM
Hey powellm1976,

you have to tell your onPrinting handler what grid you want it to display.

This case isn't actually implemented in this extension yet, but you may solve this with this code:



# your printer button handler:
var printerWindow = new Ext.ux.PrinterWindow({
iframeSrc : function() {
var href = window.location.href.split('#')[0];
return href + (href.match(/\?/) ? '&' : '?' ) + '_format=printerfriendly&grid_id=' + grid_id; # adjust grid_id variable call
}
});
printerWindow.show();


In your onPrinting handler you do something like:


var queryString = Ext.urlDecode(window.location.href.split('#')[1]);
# Use queryString.grid_id to determine which grid to display.


I hope that helps!

Cheers,
Steffen




Hey! Thanks for the great work you've done! I've been able to do some pretty cool stuff with this!

I have ran into an issue I can't figure out. I have a page that has two tables on it. Both tables are coming up fine and I can see each tables print icon above the table. When I click on the print icon from table 1 or table 2, the print preview is always the data from table 1.

How can I have the print icon print that table's data. If I click on table 2, I want the Print Preview to be table 2's data.

Thanks for the help!!!

mark

powellm1976
23 Apr 2009, 1:15 PM
Thanks for the quick reply. I'm assuming this is your code but I'm using the plugin version. I'm using the PrinterFriendly.js file and here is the top piece of code. I've also attached the .js file that I'm using. Thanks for the help!!!

Ext.ns("Ext.ux.plugins");

Ext.ux.plugins.Print = {
printGrid: function(options) {
var grid = this.component;
var store = grid.getStore();

Mark

Steffen Hiller
23 Apr 2009, 1:23 PM
Hmm ok, I actually didn't know about a plugin version.
Sorry, but I guess that's the wrong thread then. Maybe that plugin already has it's own thread where you can expect better help...
Let me know where you found that plugin, maybe others also might be interested to check it out.

Cheers,
Steffen



Thanks for the quick reply. I'm assuming this is your code but I'm using the plugin version. I'm using the PrinterFriendly.js file and here is the top piece of code. I've also attached the .js file that I'm using. Thanks for the help!!!

Ext.ns("Ext.ux.plugins");

Ext.ux.plugins.Print = {
printGrid: function(options) {
var grid = this.component;
var store = grid.getStore();

Mark

powellm1976
29 Apr 2009, 5:51 AM
Hey!

Well even though I had most of the functionality with the plugin working there were still some limitations that it looks like your great extension will solve. I am having a problem though.

First I'm using Extjs 2.2 code base and then I'm using your files from .2 Printer Friendly zip file.

I'm editing this post because I ended up geting my OnPrint to work but now when I click on the Print, I'm getting an error in the ext-all.js file. The line that highlights when I debug is

l[0].className+=" x-grid3-row-first"

I'm attaching a screen shot of what my table looks like after I say no to debugging the error. Everything appears to be in one column wrapped.

Can you provide any assistance with this?

Thanks for all your help!!

Mark

SchattenMann
11 May 2009, 8:07 AM
i'm having some really anoying error

i have no idea whats wrong (i'm just using your own example)

http://img141.imageshack.us/img141/2174/temptwh.th.jpg (http://img141.imageshack.us/img141/2174/temptwh.jpg)

riddhibhatia
11 May 2009, 10:10 PM
I hope you have a div with id as 'description' in which your print link is there

SchattenMann
12 May 2009, 3:02 AM
I hope you have a div with id as 'description' in which your print link is there

if that's for me i'm using the 0.2 example...

haven´t change anything

PulpMysteryFan
18 May 2009, 12:52 PM
I have a page with a tab panel, each of which has a grid panel. I'd like to add a "Printer Friendly" button on the toolbar for each grid panel, and have it use Ext.ux.PrinterFriendly to show that grid's data.

But how do I call Ext.printPreview() in a way that specifies which tab's grid to use?

Perhaps I can do something in the Ext.onPrinting() block? It can create one panel per tab (and therefore, one PrinterGridPanel per store and column model) -- but how would I tell Ext.ux.PrinterFriendly which of those panels to use?

Any ideas?

RacingTomcat
19 May 2009, 7:02 AM
Hi,
first off all, thank you for your great work on this extension.

When I try do run the example 0.2 and try to implement the newest source code I get the following error in firebug console:

setting property that has only getter (ext-all.js - Line 144)

Does anyone know what the problme might be?
I am using Ext JS 2.2

Steffen Hiller
20 May 2009, 5:39 AM
PulpMysteryFan,

this post should help: http://extjs.com/forum/showthread.php?p=320966#post320966

Cheers,
Steffen



I have a page with a tab panel, each of which has a grid panel. I'd like to add a "Printer Friendly" button on the toolbar for each grid panel, and have it use Ext.ux.PrinterFriendly to show that grid's data.

But how do I call Ext.printPreview() in a way that specifies which tab's grid to use?

Perhaps I can do something in the Ext.onPrinting() block? It can create one panel per tab (and therefore, one PrinterGridPanel per store and column model) -- but how would I tell Ext.ux.PrinterFriendly which of those panels to use?

Any ideas?

Steffen Hiller
16 Jun 2009, 11:58 AM
I just updated Ext.ux.PrinterFriendly to be compatible with Ext JS 2.2.1. It was only working until 2.1 before.

This fixes the problem powellm1976 and SchattenMann described above.

See here for the latest version:
http://github.com/steffen/ext.ux.printerfriendly/tree/master

metaleiro
17 Jun 2009, 11:28 AM
Is there any way for users to Form? How to use with a Form, with a Form using other components, using different components?

ByteLess
22 Jul 2009, 8:03 AM
getting the following error


Node cannot be inserted at the specified point in the hierarchy" code: "3
Ext.DomHelper=function(){var n=null;var ...(Ext.History,new Ext.util.Observable());

mianwen
26 Jul 2009, 10:33 PM
hi!
thank you very much!

mianwen
26 Jul 2009, 10:38 PM
hi!
thank you very much!

Joyfulbob
3 Aug 2009, 8:20 AM
Very nice extension! Thanks!

Two questions. When my printable grid renders in IE7 (fine in FF), the grid width appears to be huge as it scrolls way to the right. I wouldn't care, but when you go to PrintPreview the data is shrunk very tiny since the grid is so wide.

Second question, the first page in PrintPreview has only the grid headers; no data; the second page is blank, and my data starts on page 3. My 2-page report turns into 4 pages.

I didn't see any configurables I could change in PrinterFirendly.js to correct this.

Attached are images.

Here's my grid:


var grid = new Ext.grid.GridPanel({
id: 'opnsnb',
ds: snbDataStore,
cm: cm,
selModel: snbSelModel,
loadMask: false, // Turned off for printing (sometimes it sticks)
plugins: Ext.ux.plugins.Print,
view: new Ext.grid.GroupingView({
// startCollapsed:true
}),
title:'SNB Query (not selected in an invoicing batch)',
height:600,
width:975,
el: 'opnsnb_div',
collapsible:false,
stripeRows:true,
bbar: new Ext.PagingToolbar({
store: snbDataStore,
pageSize: 100,
displayInfo: true,
displayMsg: 'Displaying records {0} - {1} of {2}',
emptyMsg: "No records to display",
items: ['-',' ', itemsSummary]
}),
tbar: [
{
text: 'Search',
tooltip: 'Search',
handler: dspSearch,
iconCls:'find'
},{
text: 'Select for Invoicing',
tooltip: 'Select for Invoicing',
handler: selectForInvoicing,
iconCls:'app'
}]
});

P.S. I'm able to use this with a groupingView grid.

ByteLess
7 Aug 2009, 11:43 AM
Not sure but I am using viewport and the grid is on my center panel.

When I try to use this extension, it always load the index.cfm page which is my viewport page and not the file which is autoload in my center panel.

Is there any other printer friendly extension available?

ByteLess
24 Aug 2009, 8:07 AM
not sure what I am doing wrong, would really appreciate if someone can point out.

its just one page. and code looks like this

<html>

<head>
<title>
ColdExt Hello World (in a Panel)
</title>
<style type="text/css">
body { padding: 20px !important; font: 13px Verdana, sans-serif; }
</style>
<link type="text/css" rel="stylesheet" href="/ext/css/ext-all.css">
<link type="text/css" rel="stylesheet" href="/ext/css/xtheme-blue.css"
/>
<script type="text/javascript" src="/ext/ext-base.js">
</script>
<script type="text/javascript" src="/ext/ext-all-debug.js">
</script>
<script type="text/javascript">
Ext.onReady(function() {

Ext.BLANK_IMAGE_URL = "/ext/images/default/s.gif";
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = "side";
});
</script>
<script language="javascript" src="/PrinterFriendly/config.js">
</script>
<script language="javascript" src="/PrinterFriendly/init.js">
</script>
</head>

<body>
<div id="out">
</div>
<script type="text/javascript">
Ext.onReady(function() {

var myData = [
['3m Co', 71.72, 0.02, 0.03, '9/1 12:00am'],
['Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am'],
['Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am'],
['American Express Company', 52.55, 0.01, 0.02, '9/1 12:00am'],
['American International Group, Inc.', 64.13, 0.31, 0.49, '9/1 12:00am'],
['AT&T Inc.', 31.61, -0.48, -1.54, '9/1 12:00am'],
['Boeing Co.', 75.43, 0.53, 0.71, '9/1 12:00am'],
['Caterpillar Inc.', 67.27, 0.92, 1.39, '9/1 12:00am'],
['Citigroup, Inc.', 49.37, 0.02, 0.04, '9/1 12:00am'],
['E.I. du Pont de Nemours and Company', 40.48, 0.51, 1.28, '9/1 12:00am'],
['Exxon Mobil Corp', 68.1, -0.43, -0.64, '9/1 12:00am'],
['General Electric Company', 34.14, -0.08, -0.23, '9/1 12:00am'],
['General Motors Corporation', 30.27, 1.09, 3.74, '9/1 12:00am'],
['Hewlett-Packard Co.', 36.53, -0.03, -0.08, '9/1 12:00am'],
['Honeywell Intl Inc', 38.77, 0.05, 0.13, '9/1 12:00am'],
['Intel Corporation', 19.88, 0.31, 1.58, '9/1 12:00am'],
['International Business Machines', 81.41, 0.44, 0.54, '9/1 12:00am'],
['Johnson & Johnson', 64.72, 0.06, 0.09, '9/1 12:00am'],
['JP Morgan & Chase & Co', 45.73, 0.07, 0.15, '9/1 12:00am'],
['McDonald\'s Corporation', 36.76, 0.86, 2.40, '9/1 12:00am'],
['Merck & Co., Inc.', 40.96, 0.41, 1.01, '9/1 12:00am'],
['Microsoft Corporation', 25.84, 0.14, 0.54, '9/1 12:00am'],
['Pfizer Inc', 27.96, 0.4, 1.45, '9/1 12:00am'],
['The Coca-Cola Company', 45.07, 0.26, 0.58, '9/1 12:00am'],
['The Home Depot, Inc.', 34.64, 0.35, 1.02, '9/1 12:00am'],
['The Procter & Gamble Company', 61.91, 0.01, 0.02, '9/1 12:00am'],
['United Technologies Corporation', 63.26, 0.55, 0.88, '9/1 12:00am'],
['Verizon Communications', 35.57, 0.39, 1.11, '9/1 12:00am'],
['Wal-Mart Stores, Inc.', 45.45, 0.73, 1.63, '9/1 12:00am']];

Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

var PANEL627 = new Ext.Panel({
bodyStyle: "padding: 10px; ",
renderTo: "out",
title: "Panel",
html: "Hello World!",

dummy: true
});
var arrayStore = new Ext.data.SimpleStore({
data: myData,
fields: [{
type: "string",
name: "company"
},
{
type: "float",
name: "price"
},
{
type: "float",
name: "change"
},
{
type: "float",
name: "pctChange"
},
{
dateFormat: "n/j h:ia",
type: "date",
name: "lastChange"
}],

dummy: true
});
var GRIDPANEL270 = new Ext.grid.GridPanel({
autoExpandColumn: "company",
height: 350,
renderTo: "out",
stateId: "array-grid",
store: arrayStore,
stripeRows: true,
title: "Array Grid",
width: 600,
columns: [{
dataIndex: "company",
header: "Company",
id: "company",
sortable: true,
width: 160,

dummy: true
},
{
dataIndex: "price",
header: "Price",
renderer: 'usMoney',
sortable: true,
width: 75,

dummy: true
},
{
dataIndex: "change",
header: "Change",
sortable: true,
width: 75,

dummy: true
},
{
dataIndex: "pctChange",
header: "% Change",
sortable: true,
width: 75,

dummy: true
},
{
dataIndex: "lastChange",
header: "Last Updated",
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
sortable: true,
width: 85,

dummy: true
}],
tbar: new Ext.Toolbar({
items: [new Ext.Toolbar.Button({
text: "print",
handler: function() {

Ext.printPreview();

},

dummy: true
})],

dummy: true
}),

dummy: true
});
asim = arrayStore;

});
</script>
<script type="text/javascript">
Ext.onPrinting(function() {

// Add stylesheet that get's applied when you open your print preview (and when printing your page)
Ext.addStyleSheet("css/printer-friendly-array-grid.css");
// Or use Ext.util.CSS.swapStyleSheet( String id, String url ) to remove (via id) and add a new StyleSheet
// Don't forget to set the state manager, if you want to remember the state for your columns in the printer friendly view (hidden, order, sorting)
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

columns = [{
id: 'recno',
header: "recno",
width: 160,
sortable: true,
dataIndex: 'recno'
},
{
header: "warehosue",
width: 75,
sortable: true,
dataIndex: 'warehouse'
},
{
header: "vendor_name",
width: 75,
sortable: true,
dataIndex: 'vendor_name'
}];

new Ext.Panel({
renderTo: "out",
layout: "fit",
border: false,
bodyBorder: false,
items: [
new Ext.ux.grid.PrinterGridPanel({
store: arrayStore,
columns: columns,
stateId: 'array-grid',
//autoExpandColumn: 'recno',
title: 'Print Preview'
})]
});

});
</script>

the error I am getting is

arrayStore is not defined


I know my columns are not correct in this codeset but that should altleast display sowething here.

also why I can't just describe the column model from the grid? if I can then how?

thanks once again.

PulpMysteryFan
10 Sep 2009, 1:44 PM
I can run the example in FF, but not in Chrome. Has anyone had problems with Chrome?

desert2000
14 Sep 2009, 4:15 AM
Ext.onPrinting is not a function咋办?

ByteLess
30 Sep 2009, 11:08 AM
I am using view ports.

When I call the file directly (independent call not as a part of viewport center panel) it worked fine.

but when I hook that up with the viewport, I don't see the scrollbar on the print preview window.

there are no errors...

cristimayo
24 Nov 2009, 8:36 PM
Hi!, i was wondering if do you know how to include PrinterFriendly with EXT-GWT (gxt).
Thank you. Greetings from Mexico.
Cristina

Pekka Karalahti
8 Jan 2010, 2:39 AM
When i am closing my printview my scrollbar goes away ? any ideas what is causing this ?

pabloidz
25 Mar 2010, 9:51 AM
Any of you guys have tried to make this extension work with Ext 3.0?

I've tried to run the example, adapted the files, but the grid isn't rendered. This is what Firebug returns:


E is undefined
[Break on this error] window.undefined=window.undefined;Ext=...window.attachEvent("onunload",a)}})();

I'm still trying to trace where the error happens, but it'd be good to know if it's a known problem with this newer Ext version. I didn't find yet any other printing extension working with Ext 3+

Thanks!

dmanchikalapudi
15 May 2010, 5:17 PM
Hello Steffen. I am using EXT-GWT grid widget. I need the print functionality and realized there is no out of the box or straight fwd way of printing the entire grid. Is it possible to use this extjs print solution with the GXT grid widget ? If so, can you point me in the right direction ? I appreciate your response.

Steffen Hiller
17 Sep 2010, 8:26 AM
Ext.ux.PrinterFriendly has now Grouping View and Store support!
Added the grid example to the repository as well as added new grouping grid example.
The examples are updated to work with the latest Ext JS version 3.2.1 (before it used 2.2.1). (Ext.ux.PrinterFriendly worked out of the box with Ext JS 3.)


See first post of this thread for more information.

Regards,
Steffen

lionbs
29 Sep 2010, 4:58 AM
Hi,

is the this extension usable with EditorGridPanel?
I tried to, but until now without success...
What do I have to do?

Thanks in advance.

sorc
11 Oct 2010, 12:40 PM
Hi,

First of all: great plugin!
I have successfully used it with Ext 3.2.1. With the new version (3.3.0), it is not working properly (so far it just looks like the title is not displayed). Furthermore, Firebug reports the 2 following errors:

Ext.fly(this.innerHd) is null
ext-all-debug.js
Line 46538
this.innerHd is undefined
ext-all-debug.js
Line 46814Sounds like easy to fix?


Bye

Steffen Hiller
11 Oct 2010, 12:48 PM
Thanks, glad to hear you find it useful.

I gotta take a look at that later ... Will let you know ...

Steffen Hiller
7 Nov 2010, 7:51 AM
Ext.ux.PrinterFriendly works now with Ext JS 3.3.0!

(Works not with previous versions anymore though, if you need to get it work with older Ext JS version, get the older source from the repo, check the commits log.)

Get the latest source here: https://github.com/steffen/ext.ux.printerfriendly

scottmartin
7 Nov 2010, 1:24 PM
Downloaded the latest version using 3.3.
Running your Examples JS.

Works fine in FireFox 3.6.12
IN Chromium: 9.0.575: No display





Uncaught TypeError: Object #<an Object> has no method 'onPrinting'


examples.jsFailed to load resource
s-handle-dark.gifFailed to load resource


array-grid.js:189Uncaught TypeError: Object #<an Object> has no method 'onPrinting'


examples.jsFailed to load resource



Regards,
Scott.

Steffen Hiller
7 Nov 2010, 1:39 PM
That is interesting and strange. :-/ I can reproduce it as well.

Gonna check it out later.
Thanks for the report.

retnuh
10 Nov 2010, 12:46 PM
I've got everything working except for one little thing, how to stop the store from reloading? I want to use the data as is from the store I set when creating the Ext.ux.grid.PrinterGridPanel as it might be sorted and/or filtered on the client side.

Steffen Hiller
10 Nov 2010, 12:48 PM
It's designed to reload the data, but you can restore the state by using the StateProvider. Check the example, I think there's an example which is commented.

scottmartin
16 Nov 2010, 6:45 AM
Any update the the problem post:159?

Regards,
Scott.

Steffen Hiller
16 Nov 2010, 6:53 AM
Unfortunately haven't found time yet. :-//
I guess it has something to do with the onPrinting and the onReady function, but not sure. Maybe you can play around a bit with it. Super full this week. :-/ Sorry ...
Would also be interesting to test with older ext js version, not sure when i tested last time with chrome.

gajvik4
2 Jan 2011, 5:04 AM
Any update the the problem post:159?

Victor

Steffen Hiller
2 Jan 2011, 9:44 AM
Sorry for the wait. The latest version works now in Chrome and Safari.

What you need to change in your code is to include build/ext.ux.printerfriendly.js (or build/ext.ux.printerfriendly-debug.js) instead of init.js.

gajvik4
3 Jan 2011, 12:18 AM
Thank you. It's working !!!

andra
24 Jan 2011, 12:52 AM
hey,
i have a problem when i want to make pivot gird report with Ext.ux.PrinterFriendly. everybody can help me example printing report that support pivot grid??
thanks

astagl
14 Feb 2011, 10:47 AM
I almost have this extension working in my application.

I get the following error when I call printPreview():



printerfriendly is not defined
return eval("(" + json + ")");


Debug reveals the following "json" it is trying to decode: "_format=printerfriendly".

What's the deal?

astagl
14 Feb 2011, 1:47 PM
sorry, was my code trying to decode the url for permalinks. stupid, stupid, stupid!

astagl
14 Feb 2011, 3:11 PM
OK, almost finished, but my content is getting cut off after the first printed page. I'm applying a formpanel to the body of the iframe. Is there a better way to of doing this?

astagl
15 Feb 2011, 2:42 PM
OK, almost finished, but my content is getting cut off after the first printed page. I'm applying a formpanel to the body of the iframe. Is there a better way to of doing this?

With time comes the answer. It turns out I was missing the proper print css for showing ext object with overflow: visible. Hey, I learned a lot! :D

astagl
17 Feb 2011, 9:14 AM
Now that I have this working properly in my application, I found that I had to make a couple of minor modifications to the code to properly communicate what needed to be printed. My application is a SPA, so URLs were not cutting it.

I'm passing "config options" to the printerwindow by slightly changing the following:



Ext.ux.PrinterFriendly.printPreview = function(config) {
this.printer_window = new Ext.ux.PrinterWindow({config_options : config});
this.printer_window.show();
};


Then in the window I added a new function:



serializeConfig : function()
{
var return_string = '';

for(option in this.config_options)
return_string += '&' + option + '=' + this.config_options[option];

return return_string;
}


And modified the function iframeSrc:



iframeSrc : function() {
var href = window.location.href.split('#')[0];
return href + (href.match(/\?/) ? '&' : '?' ) + '_format=printerfriendly' + this.serializeConfig();
}


This way I can get some querystring variables passed back to the application that I de-serialize in the onPrinting() method.

I thought this could be a useful option for others with single page applications.

Thanks for the awesome ux! It finally fix one of our major problems with our Ext apps here!!!

sorc
26 Feb 2011, 1:48 PM
Hi,

I still have a problem with the plugin. On Firefox, it is working perfectly. On recent IE 8, however, I still get an error:


Error: 'this.innerHd.firstChild' is Null or no Object
Line: 46814
Zeichen: 9
Code: 0
URI: .../extjs/ext-all-debug.js

You can reproduce the error with your example that is included in the example folder.
I'm using Ext JS 3.3.0

Hopefully, it is easy to fix.


Thanks
Sorc

sorc
25 Mar 2011, 2:03 PM
No idea what the problem might be? Anyone else an idea?


Thx,
Sorc

mikosiko
28 Mar 2011, 10:37 AM
In case someone find the same problem... I tried to run the grid grouping example on IE8 and it fails with this error:


Message: Expected identifier, string or number
Line: 395
Char: 1
Code: 0
URI: http://localhost/Operations/Printerfriendly/build/ext.ux.printerfriendly-debug.js

problem happens to be a dangling comma by the end of the dorender: method ... final lines:

return buf.join('');
},

removing that comma make the example works fine in IE8.

obviously same modification need to be done in ext.ux.printerfriendly.js

Steffen Hiller
28 Mar 2011, 12:18 PM
Oh, thanks a lot mikosiko for investigating this and posting the solution!! I will fix the github version this week.

Courtney Hauth
31 Mar 2011, 12:21 PM
On my website, I have different grids which I don't wanted printed so printing the screen out of the question. From my website, just want to print a certain chart and a certain grid.

I see the examples on how to print a grid, actually got it to work on my system. I need to print a chart along with the grid.

Can PrinterFriendly utility be used to print a chart? If so, can someone provide an example, snippet or direction on how this might be done? If not, is there another method to print a charter & grid?

I have looked in other examples which print a grid, not a chart, to a static html file. I need to print a chart too.

Thank you in advance, any feedback is appreciated.

scottmartin
2 Apr 2011, 7:38 PM
When I call Ext.printPreview(), I get 404 page not found.

I have 4 files in resources/js/ux/printerfriendly:

-config.js
-ext.ux.printerfriendluy.js
-init_css.js
-printer-friendly.css



<script type="text/javascript" src="resources/js/ux/printerfriendly/config.js"></script>
<script type="text/javascript" src="resources/js/ux/printerfriendly/init_css.js"></script>
<script type="text/javascript" src="resources/js/ux/printerfriendly/ext.ux.printerfriendly.js"></script>


config:


Ext.ux.PrinterFriendly.ROOT = 'resources/js/ux/printerfriendly';


init_css


if (Ext.ux.PrinterFriendly.isPrinting()) {
Ext.ux.PrinterFriendly.util.CSS.addStyleSheet(Ext.ux.PrinterFriendly.ROOT + '/printer-friendly.css');
Ext.util.CSS.createStyleSheet('body { display: none }', 'hide-body-css');
}


onPrinting:



Ext.onPrinting(function(){

// Add stylesheet that get's applied when you open your print preview (and when printing your page)
Ext.addStyleSheet("printer-friendly.css");
// Or use Ext.util.CSS.swapStyleSheet( String id, String url ) to remove (via id) and add a new StyleSheet

// Don't forget to set the state manager, if you want to remember the state for your columns in the printer friendly view (hidden, order, sorting)
// Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

new Ext.Panel({
renderTo: 'body',
layout: 'table',
layoutConfig: { columns: 1 },
border: false,
bodyBorder: false,
items: [
// Special PrinterGridPanel which is optimized for performance for printing large data sets,
// and which shows all rows (since you can't scoll on paper)
new Ext.ux.grid.PrinterGridPanel({
store: storeRequests,
columns: cmRequest,
title: 'Request Grid'
})
]
});

});


What am I overlooking. I had the previous version working, but this time I get getting beat up.

Using CodeIgniter.

Regards,
Scott.

dranney
18 Apr 2011, 12:12 PM
Are the examples in printer friendly supposed to work out of the box? I get js errors when loading the example pages from my hard drive.

zoujpyy
24 Apr 2011, 7:31 PM
It cant't work well in IE7.help me!

fadabi
12 Jul 2011, 3:56 AM
hi
i have extjs 3.2.1 and when i apply ur ext.ux.printer i got some errors like: Line: 43998
Error: 'Ext.fly(...)' is null or not an object

when i replace my ext-all.js and ext-base.js with your same files i dont get any error.
but i cant do this because we have compressed ext-all-rtl.js and ext-base-rtl.js and i cant modify them and also u didnt put sth for rtl.

i really dont know what i should do???!
any suggestion would be welcomed!

h.wagner@telekom.de
22 Sep 2011, 11:33 PM
Any plans to make this plug-in Ext 4.0.x compatible?

Thanks in advance.

raphaelhbohrer
25 Apr 2013, 11:17 AM
up

Steffen Hiller
25 Apr 2013, 11:44 AM
No plans, sorry :(
Should I? :)

raphaelhbohrer
25 Apr 2013, 1:21 PM
I searched and found a plugin of Loiane:
http://www.loiane.com/2011/09/extjs-4-plugin-para-impressao-de-grids-gridprinter/

(http://www.loiane.com/2011/09/extjs-4-plugin-para-impressao-de-grids-gridprinter/)But it only works in the case of one grid.
In my case I would like to print a TreePanel and a panel with two grids ( treepanel and gridpanel ).

Thanks for the reply.

Steffen Hiller
25 Apr 2013, 1:33 PM
hm, my plugin isn't supporting treepanel at the moment .. but it's supporting multiple grids on one page