Bind value to model in Asp.Net MVC Application Part 2

Question

This is sort of a follow up to Bind value to model in Asp.Net MVC Application.

I have a Model with different control classes. The relevant code:

public class FileUploadModel
    {
        public HttpPostedFileBase File { get; set; }
    }

I have a partial view with the following relevant code:

@Html.TextBoxFor(x => x.File, new { type = "file", id = "File", name = "File" })

Then there is a main view in which the partial view is rendered with the following relevant code:

@using (Ajax.BeginForm("ActionMethods", "Index", new AjaxOptions { UpdateTargetId = "parameterList" }, new { enctype = "multipart/form-data" }))
{

  <div id="parameterList">
        <div id="verifyBtnDiv" style="display:none;">

             **THIS IS WHERE THE PARTIAL VIEW AS SHOWN ABOVE WOULD BE RENDERED**

            <input type="submit" id="verifyBtn" value="Verify"/>

        </div>
 </div>

}

Now when the submit happens, the file does not binds to the model property. The control passes to the controller but i debug and see that its null. ANy suggestions regarding this?

There's no overload for Ajax.BeginForm that matches your arguements. Use Ajax.BeginForm("actionMethod", "controllerName", null, new AjaxOptions { UpdateTargetId = "parameterList" }, new { enctype = "multipart/form-data" })) — WannaCSharp
– WannaCSharp, Commented Nov 8, 2013 at 12:56
oo...i tried that...but it still not binds to the model property — Why
– Why, Commented Nov 8, 2013 at 13:07
Try accepting HttpPostedFileBase as your paramter instead of the model. — WannaCSharp
– WannaCSharp, Commented Nov 8, 2013 at 13:13

Community · Accepted Answer · 2017-05-23 12:19:11Z

2

+50

There are a few issues with the code you posted that will prevent what you are attempting to do from working.

First, I am pretty certain that you cannot use the @Html.TextBoxFor helper and convert it to a file input. If it works now, I would not rely on it as you are overriding what it is meant to put out and might break in the future. Let's just put out a file input with an Id and Name matching your ViewModel property.

<input type="file" name="File" Id="File/>

Next, you cannot use Ajax.BeginForm() to upload files. It is a limitation of AJAX, not an issue with the Ajax.BeginForm. So, we will need to update your form element to a normal, Html.BeginForm, with the proper enctype (this is important)

@using (Html.BeginForm("Upload", "MyControllerName", FormMethod.Post, new { enctype = "multipart/form-data"}))
{
    <div id="parameterList">
        <div id="verifyBtnDiv" style="display:none;">
            <!-- Chose to just put the one line here instead of calling a partial-->
            <input type="file" name="File" Id="File/>
            <input type="submit" id="verifyBtn" value="Verify"/>
        </div>
 </div>
}

Lastly, if you have to/required to upload the file via AJAX, there are plenty of good recommendations on libraries to use for Ajax file uploads. I personally like the jQuery.Form plugin as it is pretty transparent in the way it handles file uploads.

edited May 23, 2017 at 12:19

CommunityBot

11 silver badge

answered Nov 12, 2013 at 23:49

Tommy

39.9k10 gold badges93 silver badges125 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Why Over a year ago

i can use javascript dor some tasks in html.beguinform as well?

Tommy Over a year ago

absolutely. Instead of the MS toolkit, you would be using jQuery natively. You can overload your Html.BeginForm() even further and give it an Id, which you can then easily reference the form. We use none of the @Ajax helpers in any of our site and still have Ajax form posts, partial page loading and file uploads. For us, there is less "magic" going on and gives us more flexibility in what we want to do.

Why Over a year ago

i am using the plugin now...thanks a lot...just a follow up...does HttpFilePostedBase works on ie7 and 8

Tommy Over a year ago

@kewal - i know it works on IE8, for IE7, since the plugin is based on jQuery 1.5 or later, it shouldn't have any issues.

Why Over a year ago

thanks a lot...i figured that...should have given it some more time...thanks a lot...

|

Collectives™ on Stack Overflow

Bind value to model in Asp.Net MVC Application Part 2

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related