CODEWITHSUNDEEP
c#asp.net
Rajeev Mehta
Rajeev Mehta

Reputation: 820

How to set limited number of files upload in asp.net multiple file upload?

I am using the multiple file upload in Asp.net with c# 

 <asp:FileUpload ID="FileUpload2" multiple="multiple" class="form-control" runat="server" />

I want to validate client side on uploading that the selection of file must be 6.

Upvotes: 3

Views: 11332

Answers (5)

Priyanka
Priyanka

Reputation: 1

Try Below in code behind,

 if (FileUpload1.PostedFiles.Count > 2) 
 {
    //error will show if file number more than 2
 }
 else
 {
    //will proceed with uploading if file count not more than 2
 }

Upvotes: 0

Rajeev Mehta
Rajeev Mehta

Reputation: 820

function ValidateFile2(){
    var fileCount = document.getElementById('FileUpload2').files.length;
    if(fileCount > 10) // Selected images with in 10 count
    {
       alert("Please select only 10 images..!!!");
       return false;
    }
    else if(fileCount <= 0) // Selected atleast 1 image check
    {
       alert("Please select atleat 1 image..!!!");
       return false;
    }

    return true;  // Good to go
}

Fiddle

Upvotes: 3

Tarak G
Tarak G

Reputation: 21

<asp:FileUpload ID="FileUpload2" ClientIDMode="Static" multiple="multiple" runat="server"/>

JQuery solution: 

 $(document).ready(function () {
        $('#FileUpload2').change(function () {
            var files = $(this)[0].files;
            if (files.length != 6) {
                alert("Six files have to be selected at a time!");
            }
            else
            {
                submit();//your custom method to submit the form
            }
        });
    });

Note: I could use the ID as selector as I have set the ClientIDMode property to static. This property was introduced from .NET 4.0 [Click here to know more]. Alternatively, you may also use the class name for the control as selector.

Upvotes: 2

Amit Soni
Amit Soni

Reputation: 3316

Try below

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

<form id="form1" runat="server">
<div>  
    <input type="file" ID="fuPhoto" multiple="multiple" />
    <input type="button" ID="btnUpload" Text="Upload"  Enabled="false" />
    <label ID="myLabel"  ForeColor="#CC0000" />
</div> 
</form>
<script>
    $(function () {
        $('#fuPhoto').change(          
        function () {  
   var files = $('input[type="file"]')[0].files;
    alert(files.length )
        //var fileExtension = ['jpeg', 'jpg'];
if (files.length>6) {
                    $('#btnUpload').attr("disabled", true);
                    $('#myLabel').html("limit upto six");
                }
                else {
                    $('#btnUpload').attr("disabled", false);
                    $('#myLabel').html(" ");
                } 
            })  
    }) 
</script>

updated Code below

$(function () { 
       var files = $('input[type="file"]')[0].files;
        alert(files.length )
    if (files.length>6) {
                        $('#btnUpload').attr("disabled", true);
                        alert("limit upto six");
                    }
                    else {
                       //nothing
                    } 
        })

Upvotes: 1

tofu
tofu

Reputation: 197

you can use the code behind and do something like

if(FileUpload2.Count < 6) { //Error } else { //OK }

you can also use a bit of JavaScript on the page to do the validation

` 

function Validate() {
    var f = document.getElementById("fu");

    if(f.files.length < 6)
    {
    }
    else
    {
    }
}        
</script>`

and on the button click event set OnClientClick="Validate();"

Upvotes: 0

Related Questions