AjaxFileUpload Button 'Upload' Failure

Question

I have done quite a bit of searching, and tried many different options. Haven't even seen any other person who has been having a similar problem.

I have the the following code placed into my page and the element reacts fine on the page. For the 'ToolKitScriptManager I have tried both the regular as well as the one shown below. Neither work.

        <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
        <asp:AjaxFileUpload ID="inpFileUpload" runat="server" OnUploadComplete="inpFileUpload_UploadComplete" MaximumNumberOfFiles="3" AllowedFileTypes="jpg,jpeg,doc,png" />

I have the following background code for the element

    protected void inpFileUpload_UploadComplete(object sender, AjaxControlToolkit.AjaxFileUploadEventArgs e)
    {
        string path = @"\\NetworkPath\UploadedFiles\" + e.FileName;
        inpFileUpload.SaveAs(path);
    }

However it gives me no error, or message stating anything that could be going wrong. I have followed every tutorial I can find on this element and none have been able to fix this issue.

I press browse to find a file, select one/more than one and everything appears to be doing fine, the files appear in the upload list.

However when I click the 'Upload' button that comes with this AjaxFileUpload element nothing happens. At times you can see red on the Upload button but it immediately goes back to the 'Upload' blue style again. Does not upload the files selected, or from what I can tell it isn't doing anything when the button is pressed other than very quickly changing the look of the button.

Not sure what I am doing wrong, or if I am missing something..

UPDATE

Thanks to the help of Matthew learned there was a javascript error console which when pressing the 'Upload' button it returns "Uncaught Exception: Failed to starting upload"

Answer 1

I can't solve the problem for you, but I can tell you where to start.

First, what browser are you using? That's likely to be important, especially if you're using an old version of IE.

After that, though, here are some tips for working with and debugging AJAX:

1. If it doesn't work, the first step is to check the Javascript error console. In IE and Chrome, press F12 to open the dev tools. In Firefox, press Ctrl+Shift+J to open the JS error console. If you're using Firefox, I recommend also using the "Web Developer" extension and Firebug.
2. If there is no error in the error console, use a good HTTP debugger/proxy (I love Fiddler) to make sure the AJAX request that you expected is the AJAX request the page is making. (If you don't already know HTTP well, this is a good way to start learning. And yes, you do need to know this stuff.)
3. Test it in more than one browser to see if it's a browser-specific issue.

Answer 2

Looks like I solved it. It has something to do with my Request.QueryString["id"] when I load the page. For some reason it reloads the page and loses that QueryString which returns null which in turn causes everything to mess up for the file upload.

When I assign a hard coded variable as the QueryString["id"] the upload works fine. However when left normal to get the QueryString it fails and returns null.

I have not solved out why it is grabbing null and not my id number but me hard coding in the id number and the upload works pretty much confirms that this is the issue.

If anyone might have information as to why my QueryString returns null on file upload that would be great! haha

ANSWER

So did some research, apparently this is a problem with AjaxToolKit and not anything I have been doing. I downloaded the links off https://ajaxcontroltoolkit.codeplex.com/workitem/27149 and used the DLLs with the updated javascript code changes and everything started working fine.

From what I found the fileupload does not parse for already placed querystrings in the URL so it replaces them with what it needs and continues on with out many errors.

Lets hope they get an updated version of it out.

Answer 3

I think you might be missing this from your web.config in <system.web> section:

<httpHandlers>
  <add verb="*" path="AjaxFileUploadHandler.axd" type="AjaxControlToolkit.AjaxFileUploadHandler, AjaxControlToolkit"/>
</httpHandlers>

Found at link: http://ajaxcontroltoolkit.codeplex.com/SourceControl/latest#SampleWebSites/AjaxControlToolkitSampleSite/Web.config

Answer 4

Add below lines to web.config file under the configuration section :

<configuration>
<system.webServer>
<handlers>
<add name="AjaxFileUploadHandler" verb="*" path="AjaxFileUploadHandler.axd" Type="AjaxControlToolkit.AjaxFileUploadHandler, AjaxControlToolkit"/>
</handlers>     
</system.webServer>`
</configuration>