How to let user know the resume they are submittin

Question

my cshtml file for upload, where would the javacsript go in this file?

@{
ViewBag.Title = "Upload";
}

<div id="progressbar">
<div id="progressbar" class="all-rounded" style="width: 20%"><span></span></div>
</div>

<div class="jumbotron">

<h2>Job Application Management System</h2>
<p class="lead2"> Welcome @((string)(ViewData["FullName"])), Please upload your resume here. Thank  you!</p>
@using (Html.BeginForm(null, null, FormMethod.Post, new { enctype =     "multipart/form-data" }))
{
<table>
    <tr>
        <td> <label> &nbsp; </label> <input type="file" class="btn btn-default"   name="File"     id="File" /></td>
    </tr>
    <tr>
        <td><input type="submit" class="btn btn-default" id="upload" value="Upload" /></td>
    </tr>
</table>
if (TempData["notice"] != null)
{
    <p>@TempData["notice"]</p>
    <p><button class="btn btn-default" onclick="location.href='@Url.Action("Create", "Accomplishments")';return false;">Continue To Accomplishments</button></p>
}
}

Here is my working code that shows how to accept a resume and save it using asp.net mvc How do I post an error message stating that the file size is too large if the user submits a file that cannot be handled. Right now, if a user submits a file too large, it takes them to an errors page. I just want a popup or something on the screen that tells them to submit a file that is smaller. Thanks!

            if (resume.File.ContentLength > 0)
            {
                string fileName = Path.GetFileName(resume.File.FileName);
                string path = Path.Combine(Server.MapPath("~/Content/Resumes"), fileName);
                resume.File.SaveAs(path);
            }
            TempData["notice"] = "Resume Added:  "+ resume.File.FileName;
            return View(resume);


        }
        catch (Exception)
        {
            ViewBag.Message = "Upload Error";
            return View("Upload");
        }
    }

Answer 1

You can do this with simple javascript :

 <script type="text/javascript">
  $('#image-file').on('change', function() {
   var filesize = this.files[0].size/1024/1024).toFixed(2) + " MB");
   //Now can use use filesize variable and check it's value and show pop.
  });
</script>

OR you can use this :

function GetFileSize(fileid) {
try {
    var fileSize = 0;
    //for IE
    if ($.browser.msie) {
        //before making an object of ActiveXObject, 
        //please make sure ActiveX is enabled in your IE browser
        var objFSO = new ActiveXObject("Scripting.FileSystemObject"); var filePath = $("#" + fileid)[0].value;
        var objFile = objFSO.getFile(filePath);
        var fileSize = objFile.size; //size in kb
        fileSize = fileSize / 1048576; //size in mb 
    }
        //for FF, Safari, Opeara and Others
    else {
        fileSize = $("#" + fileid)[0].files[0].size //It will calculate file size in kb

         // Put Your Alert or Validation Message Here


    }

}
catch (e) {
    alert("Error is :" + e);
}
}

Or you can check file size on form submit as:

 <script type="text/javascript">
  $(document).ready(function(){
  $('#upload').on('click', function(e) {
   e.PreventDefault();
   var filesize = $("#File").files[0].size/1024/1024).toFixed(2));  //filesie in MB
   //Now can use use filesize variable and check it's value and show pop.
    if(parseInt(filesize)>3){ alert("File too large");return false; }
    else{ $("form").submit(); }
  });
 });
</script>