学习ASP.NET Core Razor 编程系列十四——文件上传功能(二)
学习ASP.NET Core Razor 编程系列目录
学习ASP.NET Core Razor 编程系列二——添加一个实体
学习ASP.NET Core Razor 编程系列三——创建数据表及创建项目基本页面
学习ASP.NET Core Razor 编程系列四——Asp.Net Core Razor列表模板页面
学习ASP.NET Core Razor 编程系列五——Asp.Net Core Razor新建模板页面
学习ASP.NET Core Razor 编程系列六——数据库初始化
学习ASP.NET Core Razor 编程系列七——修改列表页面
学习ASP.NET Core Razor 编程系列八——并发处理
学习ASP.NET Core Razor 编程系列九——增加查询功能
学习ASP.NET Core Razor 编程系列十——添加新字段
学习ASP.NET Core Razor 编程系列十一——把新字段更新到数据库
学习ASP.NET Core Razor 编程系列十二——在页面中增加校验
学习ASP.NET Core Razor 编程系列十三——文件上传功能(一)
六、添加文件上传 Razor 页面
- 在Visual Studio 2017的解决方案资源管理器中,找到“Pages”文件夹,然后点击鼠标右键在弹出菜单中选择“添加-->新建文件夹”,然后把文件夹命名为“Descri”。如下图。
2. 在“Descri”文件夹上使用鼠标右键单击,在弹出菜单中选择“添加-->Razor页面…”,
3.在弹出对话框中选择“Razor页面”,然后点击“添加”按钮。如下图。
4. 在弹出对应框的“Razor页面名称”文本框中输入“Index”然后点击“添加”按钮。如下图。
5. Index.cshtml这个页面用于上传,这个页面的具体内容如下:
@page
@model RazorMvcBooks.Pages.Descri.IndexModel
@{ ViewData["Title"] = "文件上传";
} <h2>文件上传</h2>
<hr /> <h3> 文件上传</h3>
<div class="row">
<div class="col-md-4">
<form method="post" enctype="multipart/form-data"> <div class="form-group">
<label asp-for="FileUpload.FileName" class="control-label"></label>
<input asp-for="FileUpload.FileName" type="text" class="form-control" />
<span asp-validation-for="FileUpload.FileName" class="text-danger"></span>
</div> <div class="form-group"> <label asp-for="FileUpload.UploadPublicDescribe" class="control-label"></label>
<input asp-for="FileUpload.UploadPublicDescribe" type="file" class="form-control" style="height:auto" />
<span asp-validation-for="FileUpload.UploadPublicDescribe" class="text-danger"></span>
</div> <div class="form-group">
<label asp-for="FileUpload.UploadPrivateDescribe" class="control-label"></label>
<input asp-for="FileUpload.UploadPrivateDescribe" type="file" class="form-control" style="height:auto" />
<span asp-validation-for="FileUpload.UploadPrivateDescribe" class="text-danger"></span> </div>
<input type="submit" value="Upload" class="btn btn-default" /> </form>
</div>
</div> <h3>已上传文件列表</h3>
<table class="table">
<thead> <tr>
<th></th>
<th>
@Html.DisplayNameFor(model => model.Describe[0].Name) </th>
<th>
@Html.DisplayNameFor(model => model.Describe[0].UploadDateTime)
</th> <th class="text-center">
@Html.DisplayNameFor(model => model.Describe[0].PublicScheduleSize)
</th>
<th class="text-center">
@Html.DisplayNameFor(model => model.Describe[0].PrivateScheduleSize)
</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Describe)
{
<tr>
<td>
<a asp-page="./Delete" asp-route-id="@item.ID">Delete</a>
</td>
<td>
@Html.DisplayFor(modelItem => item.Name) </td>
<td>
@Html.DisplayFor(modelItem => item.UploadDateTime) </td>
<td class="text-center">
@Html.DisplayFor(modelItem => item.PublicScheduleSize)
</td>
<td class="text-center">
@Html.DisplayFor(modelItem => item.PrivateScheduleSize)
</td>
</tr>
}
</tbody>
</table> @section Scripts { @{await Html.RenderPartialAsync("_ValidationScriptsPartial");} }
6. 每个窗体组包含一个 <label>,它显示每个类属性的名称。 FileUpload 模型中的 Display 特性提供这些标签的显示值。 例如,UploadPublicDescribe特性的显示名称通过 [Display(Name = "公共描述")]进行设置,因此呈现窗体时会在此标签中显示“公共描述”。如下图。
每个窗体组包含一个验证 <span>。 如果用户输入未能满足 FileUpload 类中设置的属性特性,或者任何 ProcessFormFile 方法文件检查失败,则模型验证会失败。 模型验证失败时,会向用户呈现有用的验证消息。 例如,PublicScheduleSize 属性带有 [DisplayFormat(DataFormatString = "{0:N1}")] 注释。 如果用户输入的值不是数字,则会接收到一条指示值长度不正确的消息。
七、添加页面模型
在Visual Studio 2017的解决方案资源管理器中,选中“Descri”文件夹,鼠标右键创建一个新的页面模型 (Index.cshtml.cs),代码如下 :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using RazorMvcBooks.Models;
using Microsoft.EntityFrameworkCore;
using RazorMvcBooks.Utils; namespace RazorMvcBooks.Pages.Descri
{ public class IndexModel : PageModel
{
private readonly RazorMvcBooks.Models.BookContext _context; public IndexModel(RazorMvcBooks.Models.BookContext context)
{
_context = context;
} [BindProperty]
public FileUpload FileUpload { get; set; }
public IList<Describe> Describe { get; private set; } public async Task OnGetAsync()
{
Describe = await _context.Describe.AsNoTracking().ToListAsync(); } public async Task<IActionResult> OnPostAsync()
{
// Perform an initial check to catch FileUpload class
// attribute violations.
if (!ModelState.IsValid)
{
Describe = await _context.Describe.AsNoTracking().ToListAsync();
return Page();
} var publicDescribeData =
await FileHelpers.ProcessFormFile(FileUpload.UploadPublicDescribe, ModelState); var privateDescribeData =
await FileHelpers.ProcessFormFile(FileUpload.UploadPrivateDescribe, ModelState); // Perform a second check to catch ProcessFormFile method
// violations.
if (!ModelState.IsValid)
{
Describe = await _context.Describe.AsNoTracking().ToListAsync();
return Page();
} var descr = new Describe()
{ PublicDescribe = publicDescribeData,
PublicScheduleSize = FileUpload.UploadPublicDescribe.Length,
PrivateDescribe = privateDescribeData, PrivateScheduleSize = FileUpload.UploadPrivateDescribe.Length,
Name = FileUpload.FileName,
UploadDateTime = DateTime.UtcNow }; _context.Describe.Add(descr);
await _context.SaveChangesAsync(); return RedirectToPage("./Index");
}
}
}
在页面模型(Index.cshtml.cs 中的 IndexModel)绑定 FileUpload 类:
[BindProperty]
public FileUpload FileUpload { get; set; }
此模型还使用列表 (IList<Describe>) 在页面上显示数据库中存储的上传文件列表:
public IList< Describe > Describe { get; private set; }
页面加载 OnGetAsync 时,会从数据库填充 Describe,用于生成已加载计划的 HTML 表:
public async Task OnGetAsync()
{ Describe = await _context.Describe.AsNoTracking().ToListAsync(); }
将页面发布到服务器时,会检查 ModelState。 如果无效,会重新生成Describe,且页面会呈现一个或多个验证消息,陈述页面验证失败的原因。 如果有效,FileUpload 属性将用于“OnPostAsync”中,以完成两个上传文件的上传,并创建一个用于存储数据的新 Describe 对象。 然后会将这两个上传文件保存到数据库。
学习ASP.NET Core Razor 编程系列十四——文件上传功能(二)的更多相关文章
- 学习ASP.NET Core Razor 编程系列十五——文件上传功能(三)
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十九——分页
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十八——并发解决方案
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十六——排序
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十二——在页面中增加校验
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十——添加新字段
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Blazor编程系列十——路由(上)
学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...
- 学习ASP.NET Core Razor 编程系列十七——分组
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
- 学习ASP.NET Core Razor 编程系列十三——文件上传功能(一)
学习ASP.NET Core Razor 编程系列目录 学习ASP.NET Core Razor 编程系列一 学习ASP.NET Core Razor 编程系列二——添加一个实体 学习ASP.NET ...
随机推荐
- MDK5使用Jlink下载显示 no cortex m sw divice 解决办法
问题: (1)下面界面中找不到设备 (2)下载程序的时候提示" no cortex m sw divice " 然后是"target dll has been cance ...
- i春秋——Misc之百度杯
今天心里很是不开森,想想往日何必那么努力呢?不如你的比比皆是,可是人家就是因为有关系,你又能怎样呢? 你所有应该有的都被打翻了,别灰心,至少你曾经努力过! 愿我未来的学弟学妹们都能一直开开心心的过好每 ...
- Python核心编程
对<Python核心编程>的褒奖" The long-awaited second edition of Wesley Chun's Core PythonProgramming ...
- 基于 HTML5 的 WebGL 3D 版俄罗斯方块
前言 摘要:2D 的俄罗斯方块已经被人玩烂了,突发奇想就做了个 3D 的游戏机,用来玩俄罗斯方块...实现的基本想法是先在 2D 上实现俄罗斯方块小游戏,然后使用 3D 建模功能创建一个 3D 街机模 ...
- 大白话5分钟带你走进人工智能-第十四节过拟合解决手段L1和L2正则
第十四节过拟合解决手段L1和L2正则 第十三节中, ...
- 实战经验丨CTF中文件包含的技巧总结
站在巨人的肩头才会看见更远的世界,这是一篇技术牛人对CTF比赛中文件包含的内容总结,主要是对一些包含点的原理和特征进行归纳分析,并结合实际的例子来讲解如何绕过,全面细致,通俗易懂,掌握这个新技能定会让 ...
- [翻译 EF Core in Action 1.6]你的第一个EF Core应用程序
Entity Framework Core in Action Entityframework Core in action是 Jon P smith 所著的关于Entityframework Cor ...
- Netty源码—七、内存释放
Netty本身在内存分配上支持堆内存和直接内存,我们一般选用直接内存,这也是默认的配置.所以要理解Netty内存的释放我们得先看下直接内存的释放. Java直接内存释放 我们先来看下直接内存是怎么使用 ...
- docker(1)应用场景以及安装
今年来了新公司,公司没有用什么新技术,架构就简单的前后分离,但是我推一下新的技术,在这基础上我要培训一下同事,让他们能接受,对新技术不感到陌生,并且认可愿意去学习.其实在这个过程中也能让他们认同我这个 ...
- MySQL8.0新特性——支持原子DDL语句
MySQL 8.0开始支持原子数据定义语言(DDL)语句.此功能称为原子DDL.原子DDL语句将与DDL操作关联的数据字典更新,存储引擎操作和二进制日志写入组合到单个原子事务中.即使服务器在操作期间暂 ...