Gcobani Mkontwana

Gcobani Mkontwana

  • 987
  • 1.4k
  • 167.4k

How to display table when creating bootstrap file-upload?

Sep 10 2020 5:54 AM
Hi team
 
I need some help, i have created file-upload the idea i want to display a table, that will have 'FileName', 'DateCreated', 'DateModified', 'ModifiedBy', 'Size'. Image below is an example. This is what i have done so far
  1. // File-Upload.    
  2. [HttpGet]    
  3. public ActionResult FileIndex()    
  4. {    
  5.     RegCoursesViewModel model = new RegCoursesViewModel();    
  6.     //ViewBag.FileIndex = this.FileIndex();    
  7.     return View(model);    
  8. }    
  9.     
  10. [HttpPost]    
  11. public ActionResult FileIndex(HttpPostedFileBase files)    
  12. {    
  13.     // verify that user select a file.    
  14.     if(files !=null && files.ContentLength > 0)    
  15.     {    
  16.         //extract only the filename.    
  17.         var fileName = Path.GetFileName(files.FileName);    
  18.     
  19.         // store the file inside ~/App_Data/uploads folder.    
  20.         var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);    
  21.         files.SaveAs(path);    
  22.     }    
  23.     return RedirectToAction("FileIndex");    
  24. }    
  25. public class eNtsaFileUpload    
  26. {    
  27.     [Key]    
  28.     public int? Id { getset; }    
  29.     public string FileName { getset; }    
  30.     public DateTime DateCreated { getset; }    
  31.     public DateTime DateModified { getset; }    
  32.     public string Modified_By { getset; }    
  33.     public byte[] Size { getset; }    
  34.     public string FileUrl { getset; }    
  35.     public IEnumerable<eNtsaFileUpload> FileList { getset; }    
  36. }    
  37. <center>    
  38.     @using (Html.BeginForm("FileIndex""Home", FormMethod.Post))    
  39.     {  
  40.         <div class="form-horizontal">  
  41.             <div class="form-group row">    
  42.                 <div class="col-xs-3 ml-auto">    
  43.                     <label class="custom-file-upload">    
  44.                     <i class="fa fa-stack"></i>Upload    
  45.                     <input type="file" />    
  46.                     </label>    
  47.                 </div>    
  48.             </div>  
  49.         </div>    
  50.     }    
  51. </center>  
 

Answers (1)