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.
Related
Before I go down the rabbit hole which is over my head and I would like to avoid for now… Is there a simple way to see if an online .aspx webpage loaded in the web browser control? .html pages work fine using .DocumentCompleted for me but .aspx visually loads fine but never triggers the DocumentCompleted event. I saw some good articles that mention the need of creating separate 3 threads and etc… unlike in those articles I am not interacting with the web application (the user is) I just want to hide a few irrelevant DIV elements on the side off the page.
user9938 Thank you! Unfortunately, I cannot mark your comment as an answer so I will post it for others here.
webview2 worked amazingly. On aspx pages NavigationCompleted still did not work however I was able to achieve this with CoreWebView2_DOMContentLoaded
I'm in a huge bind.
Long story short, I am working on a big project and am learning ASP.NET, C#, everything as I go.
The elementals of my project are comprised of user controls. My line of thinking was that I could create many user controls, each performing a function for a "component" of the project I'm building. Up until now I have been using clientside scripting to postback ajax calls to the code-behind on each of my user controls. AJAX worked well because it allowed to me pass data(that I need from the client) to my user controls and then I could return something in order to do an action.
I have been using a method for generating querystrings to create a callback "action" in order to determine what method needs to handle what data when the postback is sent to the code-behind side.
My problem now is that I need to start using many user controls one page -- and so now whenever ANY control does a postback ALL of the controls go through a page load. I thought my callback solution would take of this, but it isn't. Particularly when I drop a custom registered control into another user control.
I have done multitudes of research and having seen various ways to get around this, the best of them being [WebMethod] and controllers. However the project I am working on is NON-MVC.
I am also attempting to use UpdatePanel controls to minimize postback to the entire page but have had little success.
What can I use as alternatives? I feel like I'm running out of options or am missing something very basic here.
TL;DR -- I need a non-MVC method to pass data to user controls that can distinguish between multiple controls. Cannot use pagemethods(or page). Manual ajax calls are not working out. Cannot afford to do a full postback
Take a look at:
updatepanel vs page methods
Based on this:
My problem now is that I need to start using many user controls one page -- and so now whenever ANY control does a postback ALL of the controls go through a page load.
This might sound simple but have you tried to use if(!this.IsPostBack) in your load events?
Well not, the only way to avoid this situation, is using PageMethods or create a Script Service to handle AJAX requests (Web services with the ScriptService attribute or WCF REST services)
Note that even if you use the evil UpdatePanel, absolutely all the page life cycle will execute, which means that the whole page viewstate has to be sent in each post, the only advantage of using UpdatePanel controls is that you gain partial rendering, that's it, the performance on the server side doesn't change at all.
So you could use PageMethods or Script Services. But there's a catch, if you start using them you will notice an incredible performance change, your application will be more responsive (RIA applications), but the catch is that you won't be able to use the benefits of the ASP.Net server controls such as GridView, Repeater, etc. In other words you would need to change most of your view controls (this is the approach followed when working with MVC applications)
You can create static methods on your aspx page and mark it with [WebMethod]. Then you can call the method using jQuery ajax from the user user control markup. Take a look at this blog
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.
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
I'm writing an app in which user can register. While registering the one may choose several options and according to these regiester fields are visible or not and are required or not.
I came up with an idea that all fields will be in in the updatePanel and when users changes registration options I would set visibility of these fields on the server side.
It works but incredibly slow and whats more on the FF I have the given error:
The state information is invalid for
this page and might be corrupted
3 checkboxes with other fields are in the updatePanel
Each field is in dl tag with runat="server>
I had to do it like that cause for "required" option I simply add css class to this dl (need in in javascript validation. If field should be visible I set visible="false" for given dl and then that field for example FirstName with title and so on isn visible after postback.
Am I doing something wrong ? Why does it take so long (~4 min on localhost) and in firefox it doesnt really work (when I use debug I think that process completes without errors on ff, I dont understand that at all :)
If update Panel is so weak what would be other option to change visibility and adding required class to all dls. Logic is quite complicated and has to make query to DB so simple javascript would be quite tricky.
Thanks for any hints,
Oh and I'm using ASP.Net and cant upgrade on this project.
Thanks for help,
bye
Without code to look at, here are general things which will make an UpdatePanel slow:
Large amount of form data (such as Viewstate) being posted. Uploaded data is often slower than downloading data (depending on connection type, such as a home connection where uploads can be 5x slower than downloads). Even though you can't see it, every form field on the page is posted back to the server (even if its not in the UpdatePanel).
I would suggest going through your request/response data in Firebug and making sure that your async requests are less than 5K and your responses are no more than 20K.
A slow process on the server which is running when the UpdatePanel is posted. How does your code perform when the UpdatePanel is removed?
JavaScript errors (yours and Microsoft's). Here is a link to a known bug and a fix that I have used myself: http://support.microsoft.com/?kbid=2000262
Massive DOM manipulation (doesn't sound like this is the case for you).
BTW, searching for the error message you reported gives many possible causes:
http://www.google.com/search?aq=f&sourceid=chrome&ie=UTF-8&q=The+state+information+is+invalid+for+this+page+and+might+be+corrupted
As always, minimize or remove dependencies on ViewState...it's the source of many problems and enables poor design decisions.
You need to set update Panel properties update mode to Conditional instead of Always. Limit the number of controls you put into one update panel
You might want to check, Page events etc. Research on page directive and property AutoEventWireup
Since performance is the issue you highlighted, you might want to check that as well. Update panel mode should be conditional.
Check the triggers as well
Try with these properties values inPage directive. This is always at the top of your page. Let other properties be there as they were before. Update panels should not be slow like you are reporting.
<%# Page ViewStateEncryptionMode="Never" EnableViewStateMac="false"
EnableEventValidation="false" %>
I would also like to add that if your database query that you mentioned is complex, is taking a very long time, then the problem lies not with aspx page or update panel, but with your database query. You will then need to profile your query and check how much time it's taking to execute. The way to go in that case would be to fine tune your query at database level.