Validation of the form submitted by Ajaxform jQuery plugin in ASP.NET MVC 5

Question

public  class File
{
    [Key]
    public int FileID { get; set; }
    [Display(Name = "atachfile")]
    [MaxLength(150)]
    public string atachFile{ get; set; }
}

I wrote the controller codes of the editing section like this...

    // GET: /Users/FileUpload/Edit/5
    public ActionResult Edit(int? id)
    {
        if (id == null)
        {
            return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
        }

        File file = db.Files.Find(id);

        if (file == null)
        {
            return HttpNotFound();
        }
       
        return View(file);
    }

    // POST: /Users/FileUpload/Edit/5
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Edit([Bind(Include = "FileID,atachFile")] File file, HttpPostedFileBase LearnAtach , int id)
    {
        if (ModelState.IsValid)
        {
            if (LearnAtach != null)
            {
                if (file.atachFile != null)
                {
                    System.IO.File.Delete(Server.MapPath("/File/LearnAtach/" + file.atachFile));
                }

                string[] FileExtension = { ".zip" };
                string FileType = Path.GetExtension(LearnAtach.FileName);
                double FileSize = (LearnAtach.ContentLength / 1024.0) / 1024;

                if (FileExtension.Contains(FileType.ToLower()))
                {
                    if (FileSize > 950)
                    {/
                        ViewBag.sizeatach = "error..filexize>950";
                        
                        return View(file);
                    }

                    file.atachFile = Guid.NewGuid() + Path.GetExtension(LearnAtach.FileName);
                    LearnAtach.SaveAs(Server.MapPath("/File/LearnAtach/" + file.atachFile));
                }
                else
                {
                    ViewBag.typeatach = "filyType != zip";
                    
                    this.TempData["UnSuccessMessage"] = "filyType != zip";
                    return View(file);
                }
            }
           
            fileRepository.UpdateFile(file);
            fileRepository.save();
         
            return RedirectToAction("Index");
        }
      
        return View(file);
    }

View markup:

@model DataLayer.File

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

    <div class="form-horizontal">

        @Html.ValidationSummary(true)
        @Html.HiddenFor(model => model.FileID)
      

        <div class="form-group">
            @Html.LabelFor(model => model.atachFile, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.TextBoxFor(model => model.atachFile, new { type = "file", Name = "LearnAtach"  })
               
                @Html.ValidationMessageFor(model => model.atachFile)
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input  type="submit" value="submit" class="btn btn-success" />
            </div>
        </div>
    </div>
}
<div class="progress progress-striped" style="direction: ltr">
    <div class="progress-bar progress-bar-success">0%</div>
</div>
<br /><br />
@section scripts
{
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>

    <script src="~/Scripts/modal.js"></script>

    <script>
        $(document).ready(function() {
                    var bar = $('.progress-bar');
                    var percent = $('.progress-bar');
                    var status = $('#status');
             
                    $("#fileform").ajaxForm({

                        beforeSend: function() {

                            status.empty();
                            var percentVal = '0%';
                            bar.width(percentVal);
                            percent.html(percentVal);
                        },
                        uploadProgress: function(event, position, total, percentComplete) {
                            var percentVal = percentComplete + '%';
                            bar.width(percentVal);
                            percent.html(percentVal);
                            //show preloder
                        },
                        success: function() {
                            var percentVal = '100%';
                            bar.width(percentVal);
                            percent.html(percentVal);
                            //hide preloder
                            $("#Success").modal();
                        },
                        complete: function(xhr) {
                            status.html(xhr.responseText);
                        }
                    });
        });
    </script>
}

Now the file is uploaded but the validators are not applied .. How can I show the filesize limit and filetype the file on the client side to the user and apply

In fact, if the condition of file size and format is also wrong, the uploaded file will be saved in the (/File/LearnAtach)folder, but because the condition is incorrect, its path will not be stored in the database.

Also, if the condition is true, the condition whether this file already exists or deletes the previous one will not be checked. Thanks