Taking an image and storing as string it from user using .net MVC 5

Question

I am a student developer in .Net MVC 5 and I want to insert image from new user to my database. I found a lot of method for byte[] data type but according to my researchs , there is no source for string data type.(Example; Entity Framework 5 Code first adding an image) . What can i do for string column of ImageUrl in my database? Could you help me at this issue ?

My Model :

public class usersModel{
public string userImageUrl{get;set;}
}

My Controller :

 public class UsersController : Controller
    {
        AgmEntities db = new AgmEntities();

        public ActionResult Create()
        {
            return View("Create", new usersModel());
        }

        [HttpPost]
        public ActionResult Create(usersModel uModel,HttpPostedFileBase file)
        {
            if (!ModelState.IsValid)
            {

                return View("Create");
            }

            var user = new Users();

            if(file !=null && file.ContentLength > 0)
            {
                string fileName = Path.GetFileName(file.FileName);
                string imgPath = Path.Combine(Server.MapPath("~/User_Images/"), fileName);
                file.SaveAs(imgPath);
            }
            user.userImageUrl = "~/User_Images/" + file.FileName;/*Error line*/
            db.Users.Add(user);
            db.SaveChanges();
            return RedirectToAction("Index", "Home");
        }
    }

My cshtml :

@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()

        <div class="form-group">
            @Html.LabelFor(model => model.userImageUrl, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <input type="file" name="ImageFile" />
                @Html.ValidationMessageFor(model => model.userImageUrl, "", new { @class = "text-danger" })
            </div>
        </div>
    }

To store strings you can use `varchar` or `nvarchar` types in your database — ADyson, Apr 16 '19 at 23:17
Or is that not your question? It's unclear. What actual problem are you experiencing with the code above? — ADyson, Apr 16 '19 at 23:18
I mean my method is working exactly but i can't save image file as url to my database column. I am facing an error on this line `user.userImageUrl = "~/User_Images/" + file.FileName;` while inserting. Is it clear now ? — Emre Sert, Apr 16 '19 at 23:58
"can't" isn't an error message or problem statement that anyone can fix. What happens when you do this? An error? Unexpected outcome? Please be clear and specific about the issue. I think the answer below is probably correct but it would be easier for everyone if you give a more exact description of what happens in your code. — ADyson, Apr 17 '19 at 05:32
When i ask a question from here , i will be more careful to your advice. — Emre Sert, Apr 17 '19 at 12:20

Hien Nguyen · Accepted Answer · 2019-04-17T12:39:21.763

3

You must add new { enctype="multipart/form-data"} to your form to allow upload file.

Html.BeginForm(
    null, null, FormMethod.Post, new { enctype="multipart/form-data"})

Change cshtml code to:

@using (Html.BeginForm(
    null, null, FormMethod.Post, new { enctype="multipart/form-data"})) 
{
    @Html.AntiForgeryToken()

        <div class="form-group">
            @Html.LabelFor(model => model.userImageUrl, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <input type="file" name="ImageFile" />
                @Html.ValidationMessageFor(model => model.userImageUrl, "", new { @class = "text-danger" })
            </div>
        </div>
    }

and move this line of code inside if user.userImageUrl = "~/User_Images/" + file.FileName;/*Error line*/ in this case file.FileName may be null.

 if(file !=null && file.ContentLength > 0)
            {
                string fileName = Path.GetFileName(file.FileName);
                string imgPath = Path.Combine(Server.MapPath("~/User_Images/"), fileName);
                file.SaveAs(imgPath);
                user.userImageUrl = "~/User_Images/" + file.FileName;/*Error line*/
            }

One more note that need change parameter name in action same as name of input type file:

<input type="file" name="ImageFile" /> to <input type="file" name="file" />

edited Apr 17 '19 at 12:39

answered Apr 17 '19 at 00:31

Hien Nguyen

24,551
7
52
62

I did it and also answer is so logical but although i add a photo in from form area , userImageUrl column in MsSQL is Null. Creating is succesful but while sending file , ı am facing Null area. What might be problem ? – Emre Sert Apr 17 '19 at 12:18
did you debug that user.userImageUrl has value? – Hien Nguyen Apr 17 '19 at 12:19
`file.FileName` gives an error like file.FileName = 'file.FileName' threw an exception of type 'System.NullReferenceException' when i examine with break point. It should be wrong method. – Emre Sert Apr 17 '19 at 12:26
did you move user.userImageUrl = "~/User_Images/" + file.FileName; inside if(file !=null && file.ContentLength > 0) ? – Hien Nguyen Apr 17 '19 at 12:27
Of course i moved it inside scopes. Code is working correctly but i saw an error on `file.FileName` with break point @hien-nguyen – Emre Sert Apr 17 '19 at 12:30
Did you put new { enctype="multipart/form-data"} to begin form? – Hien Nguyen Apr 17 '19 at 12:30
I did everything which you wrote me. – Emre Sert Apr 17 '19 at 12:31
2

Can you change to ? – Hien Nguyen Apr 17 '19 at 12:32
Okay. That one was true. It worked exactly now. I am taking url from image file. Thank you a lot to interest in my question. – Emre Sert Apr 17 '19 at 12:37

Taking an image and storing as string it from user using .net MVC 5

1 Answers1