I have a page which contains user controls with Telerik Charts (grids also, but they work fine). From this page, the user can click on a button to be redirected to a "Printer-Friendly Version" type page, which opens a new window via javascript and goes through a slightly different view (for formatting and stuff), but the telerik code is all the same.
The problem is, my Chart displays just fine in the original window, but the new window displays basically an empty chart with no data. This bug is only present in IE, and only applies to Charts. Grids work fine, for whatever reason. I'm thinking this is due to differences in script caching between browsers -- correct me if I'm wrong, I'm semi-new to client-directed web development.
Anyway I read somewhere that Telerik has issues with loading data and/or js files when loaded via ajax, so maybe that's the problem? If so, how could I get around this? And if not, any ideas on what could be causing this issue? It's causing me a great deal of frustration, since a print preview page seems like it should be the easiest of jobs.
Edit:
The charts are being rendered as html (if somebody can explain how to render them as images, that would be awesome). And dev tools shows basically the same thing between chrome and IE. Whenever my web service goes back up ill WinMerge them and look for any peculiarities/differences between them. In the mean time, though, the "render as an image" concept sounds promising. That way I could just save the image from the first page, and insert it right into the print preview page, right?. And since it's a print-preview page, it's not going to need to be interactive or anything, so that'd work out nicely.
Another (important) Edit:
These are probably the culprit...
And here is a little more detail on that:
And here is a side-by-side of it working(in chrome) and not working (in IE):
Have you considered using a print-specific stylesheet instead, e.g.
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
In which you specify the styling to apply when printing.
That way, you avoid reloading the page (duplicate database hits, etc.) and don't need to delve into the AJAX of Telerik's controls.
EDIT:
Regarding using an image rather than HTML, first make sure you won't lose any features/detail, then check out the .Save() method of the RadChart control. You could either save it to a memory stream, or if you want to re-use the image save it to a directory on the webserver and clean it up periodically. That way, you can just point your print version to the image and not re-generate it.
This Telerik forum post may be of use.
Related
We have a web application developed using IBM Notes(Lotus Notes). The application is designed in such a way that when a Notes document is opened in the IE(version 11) browser, it opens with its respective Notes form and one or more images belonging to that Notes document. The image(s) gets displayed in a tool developed using C# and .NET. This tool is integrated with the Notes form. The issue faced here is, whenever we enter any data in the Notes form's fields, all the thumbnails of the image in the tool gets refreshed on every keystroke. This is very uncomfortable to use when the Notes document contains a large number of images. If the Notes document contains 20 images, all 20 thumbnails gets refreshed sequentially on every keystroke when entering data in the fields of the Notes form.
We have tried using the below mentioned piece of code, but it isn't helping.
<meta charset="utf-8"
http-equiv="X-UA-Compatible"
content="IE=5; IE=7; IE=8; IE=10; IE=11">
Any suggestions on how to tackle this issue would be really appreciated, Thanks in advance.
Do you have the fields on the form set to refresh automatically? There is a setting in the form properties for this.
Otherwise I would look at how that tool works. Is that something you created yourself, or is it a third party tool? Can you look at the source code for the page (HTML and Javascript) and see what it is doing? Have you used the developer tools in IE to see what they say?
And are you using <!DOCTYPE html> ?
The issue is with the compatibility of few Active X Controls with IE-11 used in the C# and .Net application.
The issue was first suspected to be with rendering of javascript, but that wasn't the case as complete javascript code was removed from the Notes application and tested, only to find that still the reported issue was occurring.
These Active X Controls are used in the Imaging for Windows(developed by Global360). Imaging for Windows is a product which could be used(not available anymore) to develop image viewing and editing applications.
There has been a very similar question asked almost two years ago, but never solved, and now I'm running into what seems like the same exact issue with MVC 4 in IE9. I have a test site set up as plainly as possible. When I run it, it seems to work just fine. All the css is loaded, all the scripts imported, etc. But when I click the back button, virtually everything goes away.
Now, the virtually everything is an important note because a mostly static layout (with the exception of an #{ Html.RenderPartial("_MyNavPartial") } and a #RenderBody() call) returns nothing at all while another page that has a table populated with data from a service call still returns the data, with the css formatting applied to it no less. But the navigation partial is gone, and so are all of the css settings for the table's alignment on the page. When I refresh the page, it all comes back.
According to Fiddler, when the back button is hit, nothing at all comes back and viewing source shows nothing but basic markup with no content at all. The page with the table shows only the table and the css ids although the id applied to the <body> disappears.
I've tried disabling caching, changing the #Url.ActionLink() calls to #Url.Action() and even static URLs just to see if some dynamic content was in the way, and still have the exact same problem. Again, this only applies to IE9. Everything works perfectly fine in Chrome and Firefox, which makes me think there's some sort of setting that's off. What could it possibly be? Thanks ahead everyone!
I have a problem with javascript generated web page. I have a web page on the internet that is generated by javascript. I am working on changing a web page using wpf web browser control. I have to make some changes to the web page by inserting jquery, and changing css and hiding some elements.
Here is the issue.
Application works ok most of the time, but sometimes, for reasons unknown, it does not change the css or hides the elements. I presume that it has something to do with the javascript that actually generates the page. My code is executed, but no changes are made, so I presume that the script cannot find the elements in the page because they do not exist in the page, at the time of the execution of my scripts. This is just an assumption.
I need help resolving this issue. I have tried delaying the execution of my scripts for n seconds, waiting for body.ready, document.ready and window.ready, but nothing helped. Also, I use wpf web browsers LoadCompleted event, but... From time to time, the script simply makes no effect on the page. Did somebody have this issue, does anyone have any idea how to solve it?
Thank you very much in advance...
When building single page apps, always use a framework like Backbone or Sammy.js together with Mustachejs (or Hogan.js) for templating.
Since we don't have any code to look at, if you're using jQuery, I suggest you check out .live() and .on() for attaching event handlers to elements you plan on loading into a div (making them clickable) etc.
I have a rather complex web page structure containing a Silverlight control. The control loads and functions fine. However, sometimes the control seems to auto-reload itself. I'm not sure how, or why - and I'm fairly sure there's no external code in the web page that's causing it.
Basically, the way I noticed this is that the control contains some cached data. When it's created, the data is passed from JavaScript to the Silverlight control, which is then cached. The data is then deleted from the JavaScript side. Almost randomly, the Silverlight control throws an error saying there is no cached data. I found that this is because the control is re-loaded somehow - though not by JavaScript as the relevant area within JavaScript where the SL control is created is never hit a second time. But the Application_Startup event handler within the SL control is hit a second time.
Unfortunately, I cannot post the code as it is commercial and I have not yet managed to recreate this issue in a test project. I will post code if/when I do.
If that makes any sense, does anyone have any thoughts or suggestions on the matter?
You can see plugins auto reload when specific DOM elements change. Are you manipulating the DOM somehow?
Here's an example of it happening in Flash, though I've ran into the same issue with Silverlight. This is more of a Browser issue and not specific to Silverlight or Flash.
Stop reloading flash file when using show and hide methods
So i created a web site a long time ago using a designer alot like frontpage + expression design put together, and since then Ive gotten more into coding, and I'm learning html, CSS, and all that good stuff.. and i have this re-designed header that Ive made here:
http://prntscr.com/8zct
So what I need to know, is how i can get it so that when a user clicks on one of the links in the header design it will redirect to a page. and also if possible, how to make it so when a user hovers over a link a drop down may appear with other options, EDIT: I'd like to be able to add a backround image to the drop down navigation menu
As me being quite new to this sort of stuff, could anybody help me achieve this?
PS. I'm working in Visual Studio with ASP. but that doesn't change anything about the html and css stuff. just letting you guys know.
To navigate based on clicks on certain areas of an image, read about image maps.
To create menus and other active components, read about JavaScript (also recommended: jQuery).
You can also create divs that are clickable to use as hot spots on an image. that way you could add a background image to that div if ti's hovered/clicked, whereas image maps does not afford you that opportunity.