Hello,
I'm running into a strange problem where my use of the client-side AjaxRequest method is causing undesirable content updates on the page.
First, let me explain my scenario, which is rather complex.
I have several User Controls on a portal-styled page. Each time a User Control is created, I pass a reference of the AjaxManager to the User Control, then I have the User Control add an AjaxSetting to the AjaxManager so that the AjaxManager can trigger an Ajax Request that will update the content in the User Control.
I do not rely on Ajaxified buttons and such to trigger Ajax Requests since I needed to add a little extra control to the process of initiating Ajax Requests. Instead, via JavaScript setTimeout calls and JavaScript onClick events, I call a centralized JavaScript routine on the main page that calls the AjaxRequest client-side method of the AjaxManager. (As an aside, I maintain a flag to let me know when there's an active Ajax request, and when there is, any new request to initiate an Ajax Request is queued until the currently running Ajax Request completes.) This works very nicely. I can click on a dozen different buttons to trigger independent Ajax Requests. Each click queues its request, and they all execute in turn.
Here's where things get a little sticky. When the user clicks a button, I used to disable the button via Javascript before queuing the Ajax request. Then, when the content of the User Control was updated, the button would automatically return to an enabled status. I've changed this so that instead of disabling the button, I make a hidden DIV visible, have it overlay the entire contents of the user control (with a slight transparency, and an animating loading GIF.)
Now the problem. Say I have UC's (User Controls) 1, 2, and 3 all waiting for queued Ajax requests to complete. If I were to have disabled the buttons, as soon as any one of the Ajax requests completed, the buttons in all three of the UC's got re-enabled. After changing that to an overlay DIV, the DIV's in each of the UC's returned to their invisible state as soon as the Ajax request for any one of the UC's completed.
It seems to me that the problem is that the AjaxManager is configured to update content in ALL of the UC's. As such, when an Ajax request completes for any UC, the AjaxManager doesn't know which UC was being updated and it allowed for content in each of the UC's to be refreshed somehow. (Strange aside... Javascript variables, values stored in HTML controls and the like are not affected. BUT, the DIV that I changed to visible returns to a hidden state, or the button I disabled returns to an enabled state.)
Now, to get around this, I added a mechanism that causes the Loading Panels (the DIV's I change to visible) to be "registered" within the Javascript on the page. Since when any Ajax request ends they all get reset, I trigger a routine that goes through and makes them visible again. Aside from a brief blink, this works pretty well.
Having gotten to a point I'm pretty happy with how it works, I ran into another problem. I have a particular UC that has a server-side HTMLTable. In the processing of the Page_Load event, a routine runs a report that adds rows and cells to the table. Now, when another UC triggers an Ajax request, upon completion, this particular table returns to a state where it has no data in it. Effectively, all of the server-side controls that were added after the Page_Init processing (the rows and cells that hold the data), no longer exist and they disappear.
Now, I borrowed this code from another application, and I can certainly re-write it to build dynamic HTML that I shove into a DIV. Since I do that elsewhere, I expect that to work ok - I just don't really want to do that.
So, after all that, here are my questions.
I'm running into a strange problem where my use of the client-side AjaxRequest method is causing undesirable content updates on the page.
First, let me explain my scenario, which is rather complex.
I have several User Controls on a portal-styled page. Each time a User Control is created, I pass a reference of the AjaxManager to the User Control, then I have the User Control add an AjaxSetting to the AjaxManager so that the AjaxManager can trigger an Ajax Request that will update the content in the User Control.
I do not rely on Ajaxified buttons and such to trigger Ajax Requests since I needed to add a little extra control to the process of initiating Ajax Requests. Instead, via JavaScript setTimeout calls and JavaScript onClick events, I call a centralized JavaScript routine on the main page that calls the AjaxRequest client-side method of the AjaxManager. (As an aside, I maintain a flag to let me know when there's an active Ajax request, and when there is, any new request to initiate an Ajax Request is queued until the currently running Ajax Request completes.) This works very nicely. I can click on a dozen different buttons to trigger independent Ajax Requests. Each click queues its request, and they all execute in turn.
Here's where things get a little sticky. When the user clicks a button, I used to disable the button via Javascript before queuing the Ajax request. Then, when the content of the User Control was updated, the button would automatically return to an enabled status. I've changed this so that instead of disabling the button, I make a hidden DIV visible, have it overlay the entire contents of the user control (with a slight transparency, and an animating loading GIF.)
Now the problem. Say I have UC's (User Controls) 1, 2, and 3 all waiting for queued Ajax requests to complete. If I were to have disabled the buttons, as soon as any one of the Ajax requests completed, the buttons in all three of the UC's got re-enabled. After changing that to an overlay DIV, the DIV's in each of the UC's returned to their invisible state as soon as the Ajax request for any one of the UC's completed.
It seems to me that the problem is that the AjaxManager is configured to update content in ALL of the UC's. As such, when an Ajax request completes for any UC, the AjaxManager doesn't know which UC was being updated and it allowed for content in each of the UC's to be refreshed somehow. (Strange aside... Javascript variables, values stored in HTML controls and the like are not affected. BUT, the DIV that I changed to visible returns to a hidden state, or the button I disabled returns to an enabled state.)
Now, to get around this, I added a mechanism that causes the Loading Panels (the DIV's I change to visible) to be "registered" within the Javascript on the page. Since when any Ajax request ends they all get reset, I trigger a routine that goes through and makes them visible again. Aside from a brief blink, this works pretty well.
Having gotten to a point I'm pretty happy with how it works, I ran into another problem. I have a particular UC that has a server-side HTMLTable. In the processing of the Page_Load event, a routine runs a report that adds rows and cells to the table. Now, when another UC triggers an Ajax request, upon completion, this particular table returns to a state where it has no data in it. Effectively, all of the server-side controls that were added after the Page_Init processing (the rows and cells that hold the data), no longer exist and they disappear.
Now, I borrowed this code from another application, and I can certainly re-write it to build dynamic HTML that I shove into a DIV. Since I do that elsewhere, I expect that to work ok - I just don't really want to do that.
So, after all that, here are my questions.
- What exactly is the AjaxManagerProxy? I was hoping that perhaps each UC could have an AjaxManagerProxy that would act independently. I could add the AjaxSettings to the AjaxManagerProxy so that it's set to ONLY affect content in the one UC. Having read what little I could find on the AjaxManagerProxy, it seems to just transmit the settings and stuff back to the main AjaxManager, so nothing would really change. I wish the Overview documentation on the RadAjaxManagerProxy explained what its purpose was and how it's designed to be used.
- Is there a way, client-side, to tell the AjaxManager to perhaps temporarily NOT update content in some of the controls identified during the process of Adding the AjaxSettings? For example, on the server, I tell the AjaxManager (via adding AjaxSettings) that it will be updating content in DIV's DIV1, DIV2, and DIV3. Before making an Ajax Request, however, I would like to tell the AjaxManager that, for this request, we're only updating DIV1. Next time, I might tell it that we're only updating DIV3.
- Not having much faith in 1 and 2, here, I'm thinking of doing this another way. I could create a hidden button on the UC's that's coded to be the Ajax trigger. Then, in my JavaScript, rather than calling AjaxRequest, I could call AjaxRequestWithTarget. Since this would trigger an AjaxRequest as if that button were clicked, and since the button is only supposed to alter content in that DIV, then I wouldn't get the artifacts of other DIV's being updated. (I tried this before, but I didn't make the button hidden. Instead, I made it the button that the user clicked. This resulted in an immediate Ajax Request instead of my being able to handle the queue of requests. So, I'm saying that I would have two buttons. One that is visible would do the extra processing I'm asking of it, and call the AjaxManager to initiate the Ajax request. The second button, which would be hidden and never clicked by the user, would get a simulated click via the AjaxRequestWithTarget, and only the content of that UC would get updated. Does this have merit?
2 Answers, 1 is accepted
0
Hi Barry,
Straight onto your questions:
1) RadAjaxManagerProxy is just helper for different INamingContainer like UserControl and indeed the proxy control will register all ajax settings to the present RadAjaxManager.
2) You can use AjaxSettingsCreating event to cancel creation of any setting.
Let me know how it goes.
Greetings,
Vlad
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
Straight onto your questions:
1) RadAjaxManagerProxy is just helper for different INamingContainer like UserControl and indeed the proxy control will register all ajax settings to the present RadAjaxManager.
2) You can use AjaxSettingsCreating event to cancel creation of any setting.
Let me know how it goes.
Greetings,
Vlad
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
0
LeBear
Top achievements
Rank 1
Rank 1
answered on 27 Jan 2008, 12:34 PM
A follow-up on this...
I was previously setting things up so that the Ajax Manager was set to update the content in each of the gadgets on the page. When I did an Ajax call, it would then update the content in each gadget, even if there was no real change. I'd see a flash or sometimes unexpected content changes.
To address this, I created a hidden button on each gadget that is set to be the source of an Ajax request just for the content of that gadget. The script on the page that triggers the Ajax request does as an AjaxRequestWithTarget (see solution 3 in my original post) and it works fine.
I was previously setting things up so that the Ajax Manager was set to update the content in each of the gadgets on the page. When I did an Ajax call, it would then update the content in each gadget, even if there was no real change. I'd see a flash or sometimes unexpected content changes.
To address this, I created a hidden button on each gadget that is set to be the source of an Ajax request just for the content of that gadget. The script on the page that triggers the Ajax request does as an AjaxRequestWithTarget (see solution 3 in my original post) and it works fine.