Quantcast
Channel: AjaxControlToolkit Work Item Rss Feed
Viewing all articles
Browse latest Browse all 4356

Commented Unassigned: AjaxFileUpload button does not work when update panel updates [27401]

$
0
0
Hi,

I have the same issue that this guy.

http://forums.asp.net/t/1819203.aspx/1?AjaxFileUpload+does+not+work+properly+outside+an+Updatepanel

...................................

Hi all,

first of all: I´m aware that a ajaxfileupload control does not work inside an updatepanel.

But now to the problem:

I use both controls on a page but the ajaxfileupload is not in an updatepanel.
I want to use a small updatepanel to handle two cascaded dropdownlists without loosing my selections of the ajaxfileupload control by a full postback.

When the page is loaded I have no problem using the ajaxfileupload and selecting files for the upload.
This works perfectly until I select a value of the first dropdownlist and the second dropdownlist inside the updatepanel gets populated via the partial postback. From this event on, the select button of the ajaxfileupload control is without function.

.......................

In short when an updatepanel is updated ajaxfileupload select file button stops working, the drag a drop functionality works but the button does not.

I test this on the last version of Chrome.

Thanks.
Comments: I did some research on this and i find the cause of the problem. SIMPLE CODE EXAMPLE (NO CODE BEHIND NEEDED) ``` <form id="form1" runat="server"> <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" /> <asp:UpdatePanel runat="server"> <ContentTemplate> <asp:Button runat="server" /> </ContentTemplate> </asp:UpdatePanel> <ajaxToolkit:AjaxFileUpload runat="server" /> </form> ``` When the AjaxFileUpload control is initialized in javascript replace the webform onsubmit function ``` if ((typeof (WebForm_OnSubmit) == 'function') && !Sys.Extended.UI.AjaxFileUpload._originalWebForm_OnSubmit) { Sys.Extended.UI.AjaxFileUpload._originalWebForm_OnSubmit = WebForm_OnSubmit; WebForm_OnSubmit = Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmit; } ``` The new function "Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmit" that only executes when other control on the page do the postback, disables the input file of all ajaxfileupload on the page. I guess this was done to avoid uploading files of the input file, the problem is that when doing asynchronous postback in updatepanel the input file remain disabled and the select button does not work. One solution to this is to add an event handler in "Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmit" to enable the input file again. I made ​​this way. ``` Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmit = function () { /// <summary> /// Wraps ASP.NET's WebForm_OnSubmit in order to remove/disable input file controls prior to submission /// </summary> /// <returns type='Boolean'> /// Result of original WebForm_OnSubmit /// </returns> var result = Sys.Extended.UI.AjaxFileUpload._originalWebForm_OnSubmit(); if (result) { // NEW LINE ADDED Sys.WebForms.PageRequestManager.getInstance().add_endRequest(Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmitBack); // END NEW LINE ADDED var components = Sys.Application.getComponents(); for (var i = 0; i < components.length; i++) { var component = components[i]; if (Sys.Extended.UI.AjaxFileUpload.isInstanceOfType(component)) { component._html5InputFile.disabled = 'disabled'; component._inputFileElement.disabled = 'disabled'; } } } return result; }; // MY NEW FUNCTION Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmitBack = function () { Sys.WebForms.PageRequestManager.getInstance().remove_endRequest(Sys.Extended.UI.AjaxFileUpload.WebForm_OnSubmitBack); var components = Sys.Application.getComponents(); for (var i = 0; i < components.length; i++) { var component = components[i]; if (Sys.Extended.UI.AjaxFileUpload.isInstanceOfType(component)) { component._html5InputFile.disabled = ''; component._inputFileElement.disabled = ''; } } }; // END MY NEW FUNCTION ``` I hope it will be helpful and solve this bug in the next version, please! Thanks.

Viewing all articles
Browse latest Browse all 4356

Trending Articles