c# Ajax Lazy Loading - c#

I need to populate 4 GridViews on an aspx page, but I only bind a datatable to one of them on page load. I need to pupulate the other 3 after page load.
does anyone know the best way to do this using ajax ?
Currently I'm using javascript to __doPostBack on a button that pupulates the 3 GridViews but unfortunately this forces a full page load even when using an update panel. I need the page to load, and then populate the GridViews as the datatables are returned.
any suggestions would be much apreciated.

The way you are doing it should work ok, although using jquery to populate a div via the $("#targetDiv").load("contentUrl"); function may be a cleaner way to do it. Anyway, in order to get your current implementation working, there could be a few things you want to look at:
I assume EnablePartialRendering is true on your ScriptManager (always worth checking!).
Make sure the eventTarget for the __dopostback call is set up as an async trigger for your update panels or that it is inside the UpdatePanel if you are only using one UpdatePanel. (See here for details)
Try returning false from the javascript code that executes in the onclick event handler if you have attached this to a button, to make sure the form is not being submitted normally by your browser when you click the button.

If I understand the question properly, you want the data to load after the page is in the browser. If this is the case, then you can fire an event with JavaScript when the page loads on the client.
One method I've used is to put a hidden (with CSS, not any property) button on the page and 'clicking' it with javascript. The event of the button click event will need to be wired in the page's code. Also the button would have to be in an update panel that either contains the grids you want to be bound or has the appropriate triggers to cause them to reload.
You might look at JQuery to get manage when this code gets fired. The $(document).ready(function(){ /* Your code here... */ }); method will fire after the entire DOM is available, which is faster than waiting on the entire page to load (images and so forth).

Related

How to get updated page information through C# WebBrowser when updatePanel AJAX event happens?

I am automating a scenario in WPF using WebBrowser. Code snippet is as follows
string id = paginationControlProcessing[1].PageCtrl.id;
webDoc.GetElementById(id).GotFocus += new HtmlElementEventHandler(wb_OnGotFocus_PaginationControls);
webDoc.GetElementById(id).Focus();
webDoc.GetElementById(id).RaiseEvent("onChange");
webDoc.InvokeScript("__doPostBack", new object[] { "ctl00$ContentPlaceHolder1$pgControl$nextPageLink", "" });
When the page changes through pagination control, I am able to hit the event handler for focus change. Problem is happening when pagination controls are hit where I am not able to retrieve the data for 2nd and 3rd page.
I can do the page navigation and it works in the WebBrowser control. Data is also updated in the table to which these ASP.net AJAX controls are attached. In the event handler, when I look into the content of object WebBrowser1, it does not contain the content of new data that appears in the UpdatePanel control. Data for the control when 2 and 3 are clicked comes through UpdatePanel ASP.Net control.
What event can be used to capture the data coming for UpdatePanel control from server?
One way to achieve the task specified above is to use FiddlerCore but one has to be aware of the gotchas related to certificate generation in fiddlercore since ASP Panel controls use HTTPS mostly. All interactions on Panel control of ASP generates partial POST requests that result in partial responses with updatePanel contents. It does not update the page source nor there is any automatic redirection happening. Once a page is loaded, any interactions happening in Panel controls must be handled by application driving the automation and it cannot be done through WebBrowser as it is unaware of any update in the page. Be aware that UpdatePanel responses can also update the __VIEWSTATE and other hidden values. Use fiddler to capture responses and then re create them using custom processing through HttpWebRequest. HttpClient is not suitable for most cases since it needs a separate thread to handle async task and then it can become messy to handle events passing between UI, WebBrowser, Fiddler thread and HttpClient tread.
A good place to get help on usage of FiddlerCore is at the Google group for Fiddler.

AsyncFileUpload, can't refresh page after upload is completed

I have an Ajax AsyncFileUpload on one of my pages (inside a update panel). The control works, however I want the page to reload after the upload is complete. I tried a Response.Redirect in the code behind for the OnUploadedComplete method and a location.reload(true) in the OnClientUploadComplete. Both result in javascript alert of `Server Response Error: 'Unknown Server error'
Do you want to see the response page?` and the page doesn't refresh.
Has anyone been able to do a full page refresh after the upload has completed?
Edit: I mistakenly said the AsyncFileUpload is in a control panel, I meant to say update panel.
Use asp:FileUpload control and register it as postback control with Scriptmanager's RegisterPostBackControl method. Or add postback trigger entry for this FileUpload to Triggers collection of UpdatePanel
This control panel that you told. Is this a UpdatePanel? If it is, you can try an upd.Update(); to refresh the panel.
Becareful, if you have Response on your backside you may be ending your page's life cycle right there. This is just a guess. Check to make sure that your code is even reaching the intended point. Look for things like Response.End which will will prevent anything thereafter from executing.

More detailed explanation about GetPostBackEventReference method

I understand that this will causes a page reload (partial or full, depending on how your UpdatePanels are set up)
But,
where in the code I should put it (client or server side)?
which control should I send to the method? Is it must be inside the UpdatePanel?
does this method work only for controls inside update panels?
must the control have a postback capability?
what is the engine behind this? How does this method work, so I could use it properly.
Thanks.
The function call returns a string of executable JavaScript, which you need to write to the client somewhere in your response.
Typically, you're sending your Page (this/Me) unless you have a control that you specifically want to handle the postback (ie, that implements IPostBackEventHandler)
GetPostBackEventReference is not related to UpdatePanels; if you have one, it will handle the postback.
No (see #2)
This makes a postback to the page. If you want it to raise an event when it posts back, you need to implement IPostBackEventHandler, either on your page or on one of your controls.
http://msdn.microsoft.com/en-us/library/ms153112.aspx

Ajax removes any changes made my javascript

Using ajax I am causing an OnTextChangedEvent before this happens there is some Javascript that performs a check on the input field for validation and outputs some text based on whether it is valid or not. The Ajax I run resets the changes made by my javascript. It all happens in this order:
Javascript fires!
Text changes show
Ajax fires!
Text changes reset
The ajax partial autopostback is contained in an update panel. Without giving any code away is there anyone who has an idea of a way to stop the javascript changes resetting?
Over the day I will add code as I find time. Thought I would get the question up atleast. Thanks in advanced.
The Text changes are made in the DOM-Model and are not transmitted to the server.
If the ajax fires it will override the changes in the DOM made by javascript.
Solution is to transmit the validation-texts to the server and to add them again via ajax.
An UpdatePanel completely replaces the contents of the update panel on
an update.
This means that those events you subscribed to are no
longer subscribed because there are new elements in that update panel.
Full answer here
In your Page or MasterPage, put the following script
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
function EndRequestHandler(sender, args)
{
Validate(); //method that performs check on input field
}
</script>

onUploadComplete event of asyncFileUpload

how to display a btn after onUploadComplete event is executed? It's not coming now even I say btn.visible=true inside that event..
I read in one of the thread that this event happens asynchronously so we have to write javascript for it and call onClientUploadCompete.
But do anyone know how to do it withoiut writing javascript? please its urgent thanx in advance!
You've got two options - to execute client-side using JavaScript and AsyncFileUpload's OnClientUploadError and OnClientUploadComplete, or to handle the server-side UploadedComplete or UploadedFileError events fired by your AsyncFileUpload object.
If you choose client side, you can still include your Button as normal and include CSS for it to be display: none, which can be then altered in the JavaScript with something like the following:
$get(<%= AsyncFileUploaderInstanceName.ClientId %>).style.display = "block"
If you choose server side, you'll be able to refer to the .Visible property of whatever controls you like, and can alter them then. However, you'll have to update whatever UpdatePanel the button would be sitting in for the button to be rendered on the page.

Categories

Resources