Dojo file upload C# MVC.NET HttpPost without Uploader

Question

I have tried to find a good example with HTML/JavaScript/C# code to provide instruction on uploading only one file to the server for saving it to a directory on the server. My code gives me my variable, 'file', as null when I debug it.

HTML form:

<form id="uploadForm" method="post" data-dojo-type="dijit/form/Form" enctype="multipart/form-data">
    <input
        id="fileUploadInput"
        type="file"
        name="fileUploadInput"
    >
    <br />
    <br />
    <button
        id="fileUploadButton"
        data-dojo-attach-point="fileUploadButton"
        onClick="click"
    >
    Upload
    </button>
</form>

Dojo/JavaScript code:

ioIframe.send({
    url: this.proxyPostFile,
    form: "uploadForm",
    method: "POST",
    handleAs: "text",
    // Callback on successful data call:
    load: function (response, ioArgs) {
        return response;
    },
    // Callback on errors
    error: function (response, ioArgs) {
        console.info(response)
    }
});

c# code:

[HttpPost]
public JsonResult Upload(HttpPostedFileBase file)
{
    JsonResult FileData = null;
    if (Request != null)
    {
        try
        {
            if (file!=null && file.ContentLength > 0)
            {
                ... do some stuff with the file
            }
        }
        catch (Exception ex)
        {
            Dictionary<string,string> error = new Dictionary<string,string>();
            error.Add("error", "ERROR:" + ex.Message.ToString());
            FileData = Json(error);
        }
    }
    else
    {
        Dictionary<string,string> callResponse = new Dictionary<string,string>();
        callResponse.Add("filename", "You have not specified a file.");
        FileData = Json(callResponse);
    }
    return FileData;
}

Any thoughts or help would be appreciated.

Thank You

Your file input has `name="fileUploadInput"` which does not match the name of the parameter in the method (`file`). They need to match. But the fact that your returning a `JsonResult` suggests you want to use ajax, in which case, refer [this answer](http://stackoverflow.com/questions/29293637/how-to-append-whole-set-of-model-to-formdata-and-obtain-it-in-mvc/29293681#29293681) - you need to use `FormData` and set the correct ajax options — , Sep 01 '17 at 01:37
@StephenMuecke This would work, if I could use jQuery, but unfortunately I'm using Dojo. Thanks though. — Matthew Dewell, Sep 01 '17 at 11:31
That does not change the fact that your `name` attribute and the method parameter does not match - they need to :) — , Sep 01 '17 at 11:34
@StephenMuecke You are correct sir! Sorry, I hadn't gotten a chance to change the id/name to match the C# code. That fixed it. Thank You very much. Could you write an "answer" in this section that shows your "change name" solution, and I can mark it as a an answer to my problem. Thank You. — Matthew Dewell, Sep 01 '17 at 11:48

Djordje · Answer 1 · 2018-01-23T12:44:23.900

0

Sorry, I am little confused, I don't know if you are trying to upload a file using ajax or a form. If you are using a form try to put enctype="multipart/form-data" attribute. Hope this helps.

edited Jan 23 '18 at 12:44

answered Aug 31 '17 at 13:38

Djordje

437
1
12
24

Great suggestion. I was hoping it would work, as I believe it does need to be there, but I still get a null, after I added it. I will edit my post. – Matthew Dewell Aug 31 '17 at 13:45

score 0 · Answer 2 · answered Aug 31 '17 at 16:26

0

Take a look at this fiddle link. Dojo provides OOTB feature to upload file(s) to a server side (you can pass url like /test.php

http://jsfiddle.net/kolban/e47YU/

If you don't want to pass the server url or if you don't have one, then you need to manually upload the file using dijit.byId("uploader').upload();

answered Aug 31 '17 at 16:26

bajji

1,271
3
15
37

@ Manjunatha Muniyappa I appreciate the response, but I need it without the use of dojox/Uploader – Matthew Dewell Aug 31 '17 at 16:44
The subject of your question was Dojo file upload so I gave this answer. Sorry if that was not helpful to you. – bajji Aug 31 '17 at 21:20
No problem. I am using the rest of Dojo, but not any of the Dojox utils. Thanks though. – Matthew Dewell Aug 31 '17 at 22:02

score 0 · Accepted Answer · answered Sep 01 '17 at 11:54

0

Your generating the file input with name="fileUploadInput" but your parameter in the POST method is named file - they need to match in order for the parameter in the POST method to bind to the value of the form control.

Change the input to match the parameter

<input name="file" ... />

answered Sep 01 '17 at 11:54

Thank you very much Stephen. This did it. – Matthew Dewell Sep 01 '17 at 11:57

Dojo file upload C# MVC.NET HttpPost without Uploader

3 Answers3