Develop Reference

limit number of files to be uploaded in mvc

In my MVC application, i have information upload form. Here user can upload videos and images. To do this i have created to file controls, one for videos and one for images. Here user should be only able to upload at max 2 videos and at max 5 images for single form. Can any one suggest me how can i limit the user to upload number of files. i.e. if only 2 videos and 5 images also where should i implement this for best use? in controller or using javascript?

The MVC file upload approach:
<input type="file" name="file" id="file" />
This passes a HttpPostedFileBase to the controller or if you have multiple IEnumerable<HttpPostedFileBase>. You can then evaluate the number of files and file types and return any functionality/messages back to the user.
[HttpPost]
public ActionResult Index(HttpPostedFileBase file) {...
Or
<input type="file" name="files" id="file" />
<input type="file" name="files" id="file" />
[HttpPost]
public ActionResult Index(IEnumerable<HttpPostedFileBase> files) {...

I tried using javascript
File upload control :
<input type="file" id="t" name="t" onchange="checkFilesCount(this)" multiple>
javascript code :
function checkFilesCount(id) {
if(id.files.length > 5)
{
alert('you cant upload files more than 5');
document.getElementById("t").value = "";
}
}

List property ignored by controller if 0 index is missing

I'm building a webform in c# .net mvc using mongodb to store information. The form works with a company object that has a property that is a List of Addresses, called addressdata. When the form is submitted, the company object is sent to the controller and then upserted into MongoDB. The input names take the form
<input type="text" name="Company.addressdata[a].city" />
Where "a" is the index in the list. This all works great! The list of address objects is created upon submission and inserts into mongoDB.
However, I just added the ability to delete addresses, and now I'm running into trouble. I have noticed that when a user deletes the first row, all the rows after are lost. So, if they delete the 0 index, the Company object will not populate the list of Addresses and thus they will not go into MongoDB.
Is there a way to work around this? Is this how it's designed to work? It seems like too much to renumber all of the following rows with the new index, but is that what it takes? Or is there another way?

In my experience, that's by design. The indexes must start from 0, or you have to define your own indexes for each of them with a special element.
This article shows an example of that: http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/
<form method="post" action="/Home/Create">
<input type="hidden" name="products.Index" value="cold" />
<input type="text" name="products[cold].Name" value="Beer" />
<input type="text" name="products[cold].Price" value="7.32" />
<input type="hidden" name="products.Index" value="123" />
<input type="text" name="products[123].Name" value="Chips" />
<input type="text" name="products[123].Price" value="2.23" />
<input type="hidden" name="products.Index" value="caliente" />
<input type="text" name="products[caliente].Name" value="Salsa" />
<input type="text" name="products[caliente].Price" value="1.23" />
<input type="submit" />
</form>
So you have options, either:
Update indices when deleting, or
Define arbitrary indices

Get files separately from different multiple file inputs

Lets say I have a html form
<form id="frm" method="post" action="upload.cshtml" enctype="multipart/form-data">
<input multiple type="file" name="file1" />
<input multiple type="file" name="file2" />
<input type="submit" />
</form>
The from has two inputs each accepting multiple files. When this form is submitted, Request.Files["file1"] will only give the first file in the file1 input. In order to access the rest of the files I would have to iterate Request.Files[] in a loop. The latter method however gives all files of both inputs. How do I get the files separately so that I can perform different actions on the different sets of files?

Easiest is to define appropriate parameters to the action method:
public ActionResult Upload(IEnumerable<HttpPostedFileBase> file1,
IEnumerable<HttpPostedFileBase> file2)
{
// process file1 and file2
}
The file1 enumerable will contain all files from the input with the name file1 and so does file2 contain the files from file2.

ASP.net MVC3 getting checkbox value from HTML form

I have a simple form in my MVC3 site that allows users to create a contest entry. This has been implemented and works fine currently, but a request has been made to now allow users to make their entries private.
In my Entry model I added a boolean isPrivate. Then I figured I would change the HTML forms for create and edit to include a checkbox to specify whether the entry should be private.
I'm new to MVC3, but I figured I could simply change the action that the form posts to by including a new boolean parameter.
This unfortunately doesn't seem to work. Can anyone tell me how checkbox values are passed from an HTML form to a post action? This is probably fairly common, but I can't seem to find an example for this on the web. Almost all the examples out there simple show text inputs, I can't find anything with checkboxes.
Form:
<form method="post" action="../Entry/Create" enctype="multipart/form-data" onsubmit="return isValidInput()">
<input type="text" id="EntryTitle" name="EntryTitle" />
<div id="invalidTitle" class="invalidData"></div>
<p id="char-remaining">(100 characters remaining)</p>
<input type="text" id="EntryVideo" name="EntryVideo" />
<div id="invalidVideo" class="invalidData"></div>
<p id="vid-desc">(URL of the Video to Embed)</p>
<input type="file" id="ImageFile" name="ImageFile" />
<div id="invalidImage" class="invalidData"></div>
<p id="file-desc">(200x200px, jpeg, png, or gif)</p>
<textarea id="EntryDesc" name="EntryDesc"></textarea>
<div id="invalidDesc" class="invalidData"></div>
<br />
<input type="checkbox" id="isPrivate" name="isPrivate" />
Make my entry private.
<br />
(private entries will only be viewable by you and site administrators)
<br />
<button id="new-entry-save">save</button>
</form>
Action:
public ActionResult Create(string EntryTitle, string EntryVideo, HttpPostedFileBase ImageFile, string EntryDesc, Boolean isPrivate)
{
...
}

add value="true" to checkbox, also add hidden input after it with same name and value=false, i.e.:
<input type="checkbox" id="isPrivate" name="isPrivate" value="true" />
<input type="hidden" name="isPrivate" value="false" />
If you don't want to use hidden, use bool? instead of bool (e.g. nullable)

The other option is to have hidden text field with the same name to force data in unchecked field to be part of the post. See Post the checkboxes that are unchecked.
<form>
<input type='hidden' value='0' name='selfdestruct'>
<input type='checkbox' value='1' name='selfdestruct'>
</form>

File uploader in asp.net mvc

How can identify input (type="file") id of fileupload while file uploading to server.
Let me explain in detail:
I have multiple file upload control on my page and different control save file on different folders like "Fileupload1" will save file on "Folder1" and so on.

You can't. The id of an HTML element is never sent to the server when posting a form. As far as the name attribute is concerned you may loop through the Request.Files collection. In ASP.NET MVC it more common to use action parameters. Example:
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="files" id="file1" />
<input type="file" name="files" id="file2" />
<input type="file" name="files" id="file3" />
<input type="submit" value="Upload files" />
</form>
and your controller action:
[HttpPost]
public ActionResult Index(IEnumerable<HttpPostedFileBase> files)
{
foreach (var file in files)
{
if (file.ContentLength > 0)
{
var fileName = Path.GetFileName(file.FileName);
var path = Path.Combine(Server.MapPath("~/App_Data"), fileName);
file.SaveAs(path);
}
}
return RedirectToAction("Index");
}
It's as simple as that.

As Darian points out, the ID isn't sent. But the name attribute is, so your file upload should be something like:
<input type="file" name="contactsFile" />
Which will let you use a method such as
public ActionResult UploadFile(HttpPostedFileBase contactsFile)
in your controller.

You won't have access to any DOM element since ASP.NET MVC uses the FileCollectionModelBinder to create a collection of files. So what you receive in your controller won't have anything to do with the DOM. But the good thing is since it's a collection you can access the index of the file.
<input type="file" name="files[0]" id="file1" />
<input type="file" name="files[1]" id="file2" />
<input type="file" name="files[2]" id="file3" />
Then if you need to upload files[0] to folder Y and files[1] to folder Z you can access the files collection index.
switch (index)
{
case 0:
// Upload to Y
case 1:
// Upload to Z
default:
}