IE 11 is printing blank page except last page - css

I am trying to print ExtJs 4.2 panel.
This panel consists of several ExtJs grids in vbox layout.
The panel is rendered to a hidden div on fly.
In afterender listener of panel, a new window is created using window.open('') construct and the hidden div's innerHTML is written to the newly created window.document.
The newly created document is then closed and printed using regular window.print construct.
This arrangement works in the following scenarios:
In internet explorer, when the panel size is small and can be printed in a single page
In Chrome browser irrespective of the size of the panel
However as soon as panel grows based on the data stores attached to inner grids, IE prints only the last page and all pages prior to last page are printed as blank pages.
I have tried various IE specific CSS discussed on this forum and other techniques but nothing seems to work.
Any suggestions?

Related

Runtime change in content of Label not resizes properly view when placed label inside a Frame?

I have created a custom control in Xamarin.Forms for my demo application, in my control I used a custom template for my view, the template consists of Frame --> Grid --> Label whenever I changed the binding text to the labels, the view height should be resized, but it not works as excepted.
If I remove the frame it works fine and height resizes properly. It happens in android, iOS, and UWP.
To notify the size changes in the template, wired the templateView.Element.MeasureInvalidated event, it raised properly and resizing working fine for runtime changes if the frame is not included. If the frame included in my data template event is not raised.

OpenUI5: PDFViewer shows PDF page on top of all other controls in IE11

I am trying to show a dialog control using sap.m.Dialog on top of PDFViewer control in IE11. In this case, PDFViewer and dialog controls both will get activated at the same time.i.e., z-order of PDFViewer and Dialog control will become the same.
This limitation of PDFViewer is specifed at: PDF Viewer
To solve this issue, openui5 specify that we have to insert another iframe element between the PDF viewer and the rest of the elements on the page.
I don't really understand the meaning of the sentence specified above. Can someone help me on how to insert another iframe element between pdf viewer and rest of the elements of the page.
Screenshot

IE9 compatiblity mode doesn't work

I have an iFrame in my code and calling a page in this iFrame. The page contains a video player which is stored in my public_html/video folder.
This page on it's own runs perfectly. When it calls into the iframe in IE9, I am getting a blank white page...
I used many types of X-UA, but nothing happens.
Any suggestions?
The page is rendered according to the topmost frame (the browser mode is set only once at the beginning and all values in nested frames are being ignored).

How can you add a TouchGridPanel to a Panel in Sencha 2?

I'm currently using the Sencha Ext.ux.TouchGridPanel, and I need to know how to add it to a Panel dynamically. Currently, I set up a store, then use a function to generate the Panel. I then use
myPanel.add(myTouchGridPanel);
This displays the toolbar and headings of the Panel, but not any of the information within it. Making the TouchGridPanel fullscreen works, but then the animations are sloppy.
If the component is working correctly, perhaps the panel you are inserting it into is not the size you expect it to be?
Or maybe the GridPanel is not stretching to the size of the panel, in which case, you should add a fit or card layout to the panel, so it fits to the size of that panel.
If neither of these two things work, I suggest you open up web inspector and look at the dom of your panel - and see what the size of it is, and if the grid is actually being added to it or not.

How should I design my page to allow for dynamic movement of elements on the page?

I'm working on an ASP.NET page where I've got 10 entities. I'll call them Items. An Item can be displayed in one of two modes: Featured or Thumbnail. At any given time there is one Featured Item at the top of the page, and the rest are Thumbnails arranged in a 3x3 grid underneath the featured Item Each item is an ASP usercontrol that contains two divs: one div for Featured and one for Thumbnail -- when the item is Featured, the Thumbnail div is set as invisible and vice versa.
My current goal is to be able to click on any of the Thumbnails and have it physically swap places with the currently featured item to make the clicked Thumbnail become the new current Featured item at the top of the page. The eventual goal is to use jQuery to animate the movement but this is only a side consideration at this point. Also please note that I am trying to do all this without the use of page refreshes (i.e. I wish to use AJAX or javascript)
Here are some of the possibilities that I have been thinking about:
Put the entire page inside an UpdatePanel and rearrange which Item usercontrol goes to which placeholder (i'm using placeholders)
Pros: easy
Cons: VERY INEFFICIENT. Each Item already has a couple UpdatePanels in them despite my trying to minimize my use of them
Use jQuery/javascript to swap the order of the items' occurrences within the page
Pros: simply swapping the order would work because I have the items arranged by floating
Cons: my javascript/jquery is weak, and if a user ever navigates away and comes back the change will not persist.
Dear web dev wizards out there, what would you do if you were in my shoes?
This feels a bit like a slide show. As such, I'd go strictly client side javascript. I wouldn't worry too much about state persistence though you could do that if you want by setting a cookie or appending the url with anchor hashes.
Also, at that point, you wouldn't really need multiple DIVs for each item. You could, via the jQuery move the div itself and then change the SRC attribute (and CSS) of the image to go fetch the larger one.

Resources