html.partial mvc5,ASP.NET MVC5网站开发我的咨询列表及添加咨询（十二）

最新推荐文章于 2021-07-02 09:26:46 发布
最新推荐文章于 2021-07-02 09:26:46 发布
阅读量122 收藏
点赞数
文章标签： html.partial mvc5

上次把咨询的架构搭好了，现在分两次来完成咨询：1、用户部分，2管理部分。这次实现用户部分，包含两个功能，查看我的咨询和进行咨询。

一、菜单

打开上次添加的ConsultationController控制器，添加Menu action，返回分布视图

///

/// 菜单

///

///

public ActionResult Menu()

{

return PartialView();

}

右键添视图

再打开Home/menu视图

ede26effe07ab74f85aeed7ae4dcf4db.png

添加分布视图引用

9a5dfa6ed8fdc4deb51853f33073ebb5.png

运行一下，在留言器中看下/Member/Home。效果如。

fe8b7ae41c14c84705aa56bf44faed15.png

二、我的咨询

我的咨询部分用datagrid显示自己的咨询列表，datagrid使用详细视图功能，点开折叠可以看到详细内容。

效果是这样，折叠时：

bd683e2d80632ef07717bf7a1dd1b240.png

点开后

0a89aa21c6fe235eb97a41f15b73482a.png

这是datagrid的扩展功能，先要去官网下载jquery-easyui-datagridview.zip，然后把里面的jquery.easyui.datagrid.detailview.js文件放到项目/Scripts文件夹下。

c72e7a67a163b64dbb70b04f5cd2e582.png

打开ConsultationController控制器，添加MyJsonList方法，返回我的咨询的json列表

public JsonResult MyJsonList(int pageIndex = 1, int pageSize = 20)

{

int _total;

var _list = commonModelService.FindPageList(out _total, pageIndex, pageSize, "Consultation", string.Empty, 0, User.Identity.Name, null, null, 0).ToList().Select(

cm => new Ninesky.Web.Models.CommonModelViewModel()

{

CategoryID = cm.CategoryID,

CategoryName = cm.Category.Name,

DefaultPicUrl = cm.DefaultPicUrl,

Hits = cm.Hits,

Inputer = cm.Inputer,

Model = cm.Model,

ModelID = cm.ModelID,

ReleaseDate = cm.ReleaseDate,

Status = cm.Status,

Title = cm.Title

});

return Json(new { total = _total, rows = _list.ToList() });

}

再次添加MyList方法，直接返回视图

///

/// 我的咨询

///

///

public ActionResult MyList()

{

return View();

}

右键为MyList添加视图。

@{

ViewBag.Title = "我的咨询";

}

$("#Consultation_List").datagrid({

loadMsg: '加载中……',

fitColumns:true,

pagination: true,

singleSelect: true,

url: '@Url.Action("MyJsonList", "Consultation")',

columns: [[

{ field: 'ModelID', title: 'ID' },

{ field: 'Title', title: '标题'},

{ field: 'Inputer', title: '咨询人', align: 'right' },

{ field: 'ReleaseDate', title: '咨询日期', align: 'right', formatter: function (value, row, index) { return jsonDateFormat(value); } },

{ field: 'StatusString', title: '状态', width: 100, align: 'right' }

]],

toolbar: '#toolbar',

idField: 'ModelID',

view: detailview,

detailFormatter: function (rowIndex, rowData) { return '

onExpandRow: function (index, row) {

var detail = $(this).datagrid('getRowDetail', index).find('div.detail');

detail.panel({

height: 160,

border: false,

cache: false,

href: '@Url.Content("~/Member/Consultation/Index")/' + row.ModelID,

onLoad: function () {

$('#Consultation_List').datagrid('fixDetailRowHeight', index);

}

});

$('#Consultation_List').datagrid('fixDetailRowHeight', index);

}

});

//添加按钮

$("#btn_add").click(function () {

window.parent.addTab("进行咨询", "@Url.Action("Add", "Consultation")", "icon-page");

});

这段代码比较长,解释一下：

这是datagrid的主题和工具栏。

引用~/Scripts/Common.js 是因为里面包含日期格式化方法，json传过来的日期必须格式化后才能正常显示。

引用~/Scripts/jquery.easyui.datagrid.detailview.js 是datagrid像是视图必须的。f171551899abd90fd28d37b7e20538a5.png

这个是初始化datagrid。其中1是使用Common.js中的jsonDateFormater方法格式化日期。2、就是详细视图部分

view: detailview,

detailFormatter: function (rowIndex, rowData) { return '

这两句使用详细视图，并为详细视图添加一个

onExpandRow: function (index, row) {

var detail = $(this).datagrid('getRowDetail', index).find('div.detail');

detail.panel({

height: 160,

border: false,

cache: false,

href: '@Url.Content("~/Member/Consultation/Index")/' + row.ModelID,

onLoad: function () {

$('#Consultation_List').datagrid('fixDetailRowHeight', index);

}

});

这段是在行展开时为详细视图的div链接到~/Member/Consultation/Index/id视图

下面来添加Consultation/Index这个分布视图

在控制器中添加Index action 并返回分布视图

public ActionResult Index(int id)

{

return PartialView(commonModelService.Find(id).Consultation);

}

右键添加强类型(Consultation)分布视图

@model Ninesky.Models.Consultation

@Html.DisplayNameFor(model => model.Name)@Html.DisplayFor(model => model.Name)@Html.DisplayNameFor(model => model.IsPublic)@Html.DisplayFor(model => model.IsPublic)
@Html.DisplayNameFor(model => model.QQ)@Html.DisplayFor(model => model.QQ)@Html.DisplayNameFor(model => model.Email)@Html.DisplayFor(model => model.Email)
@Html.DisplayNameFor(model => model.Content)@Html.DisplayFor(model => model.Content)

@if (Model.ReplyTime != null)

{

管理员于：@Model.ReplyTime 回复如下

@Model.ReplyContent

}

完工

三、进行咨询

在Consultation控制器添加 Add  action

///

/// 添加

///

///

public ActionResult Add()

{

InterfaceUserService _userService = new UserService();

var _user = _userService.Find(User.Identity.Name);

CommonModel _cModel = new CommonModel();

_cModel.Consultation = new Consultation() { Email = _user.Email, IsPublic = true, Name = _user.DisplayName };

_user = null;

_userService = null;

return View(_cModel);

}

在action中先查询用户信息，构造一个CommonModel并传给视图

右键添加视图

@model Ninesky.Models.CommonModel

@{

ViewBag.Title = "进行咨询";

}

@using (Html.BeginForm())

{

@Html.AntiForgeryToken()

进行咨询

@Html.ValidationSummary(true)

类型

@Html.ValidationMessageFor(model => model.CategoryID)

@Html.LabelFor(model => model.Title, new { @class = "control-label col-sm-2" })

@Html.TextBoxFor(model => model.Title, new { @class = "form-control" })

@Html.ValidationMessageFor(model => model.Title)

@Html.LabelFor(model => model.Consultation.Name, new { @class = "control-label col-sm-2" })

@Html.TextBoxFor(model => model.Consultation.Name, new { @class = "form-control", @readonly = "readonly" })

@Html.ValidationMessageFor(model => model.Consultation.Name)

@Html.LabelFor(model => model.Consultation.QQ, new { @class = "control-label col-sm-2" })

@Html.TextBoxFor(model => model.Consultation.QQ, new { @class = "form-control" })

@Html.ValidationMessageFor(model => model.Consultation.QQ)

@Html.LabelFor(model => model.Consultation.IsPublic, new { @class = "control-label col-sm-2" })

@Html.RadioButtonFor(model => model.Consultation.IsPublic,true) 公开

@Html.RadioButtonFor(model => model.Consultation.IsPublic, false) 仅自己查看

@Html.ValidationMessageFor(model => model.Consultation.IsPublic)

@Html.LabelFor(model => model.Consultation.Email, new { @class = "control-label col-sm-2" })

@Html.TextBoxFor(model => model.Consultation.Email, new { @class = "form-control" })

@Html.ValidationMessageFor(model => model.Consultation.Email)

@Html.LabelFor(model => model.Consultation.Content, new { @class = "control-label col-sm-2" })

@Html.TextAreaFor(model => model.Consultation.Content, new { @class = "form-control" })

@Html.ValidationMessageFor(model => model.Consultation.Content)

}

与添加文章非常类似，下面写接受方法

再次在控制器中添加Add action

[HttpPost]

[ValidateAntiForgeryToken]

public ActionResult Add(CommonModel commonModel)

{

if(ModelState.IsValid)

{

InterfaceUserService _userService = new UserService();

var _user = _userService.Find(User.Identity.Name);

if (commonModel.Article != null) commonModel.Article = null;

if (commonModel.Attachment != null) commonModel.Attachment = null;

if (commonModel.DefaultPicUrl != null) commonModel.DefaultPicUrl = null;

commonModel.Hits = 0;

commonModel.Inputer = User.Identity.Name;

commonModel.Model = "Consultation";

commonModel.ReleaseDate = System.DateTime.Now;

commonModel.Status = 20;

commonModel.Consultation.Name = _user.DisplayName;

_user = null;

_userService = null;

commonModel = commonModelService.Add(commonModel);

if (commonModel.ModelID > 0) return View("AddSucess", commonModel);

}

return View(commonModel);

}

在action中如果验证通过，先查找用户，并将Article、Attachment设为null，这是防止用户偷偷夹带私货。然后初始化commonModel的Hits、Inputer等字段并保存。

效果：

27c306f6e2e3e07df9c97f303d359383.png

de46ea6d5c8a6a3c18a6a7a73af27068.png

我的咨询实现了查看我的咨询和进行咨询两个功能，查看使用了datagrid的详细视图。

以上就是我的咨询列表及添加咨询的实现全过程，希望对大家的学习有所帮助。

Snow668
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Asp.net MVC中Html.Partial, RenderPartial, Action,RenderAction 区别和用法
01-04
此文档详细讲解了：Asp.net MVC中Html.Partial, RenderPartial, Action,RenderAction 区别和用法，值得学习
ASP.NET MVC5网站开发我的咨询列表及添加咨询（十二）
01-02
这次实现用户部分，包含两个功能，查看我的咨询和进行咨询。 一、菜单 打开上次添加的ConsultationController控制器，添加Menu action，返回分布视图 /// /// 菜单 /// /// <returns></returns> public ...
【初学者指南】在ASP.NET MVC 5中创建GridView
葡萄城控件技术团队
11-15 267
介绍 在这篇文章中，我们将会学习如何在 ASP.NET MVC 中创建一个 gridview，就像 ASP.NET Web 表单中的 gridview 一样。服务器端和客户端有许多可用的第三方库，这些库能够提供所有必需的功能，如 Web 表格中的搜索、排序和分页等。是否包含这些功能，取决于应用的特殊需求，例如在客户端和服务器端提供搜索或其它功能的需求等。 可用的库 以下是一些可用的库和插...
html.partial mvc,MVC Html.Partial或Html.Action
weixin_35712223的博客
07-02 244
Html.Partial：呈现部分视图，而不首先点击控制器操作。请参阅：Partial ViewsHtml.Action调用控制器操作，可能会返回视图/部分视图(或者可能不会，它可能会抛出HttpNotFound或者返回Json或其他东西)。您的菜单是需要视图模型还是静态？如果是静态菜单，Html.Partial将满足您的需求。将静态菜单内容放在局部视图中，并将Html.Partial调用到您想要...
html.partial mvc,MVC Html.Partial or Html.Action
weixin_33848693的博客
06-15 91
问题I am new to asp.net MVC so please bear with me. I need build a menu that repeats across multiple views. What would better serve the purpose Html.Action OR Html.Partial.回答1:Here are what I consider m...
MVC.rar_ASP.NET MVC_asp.net C＃_mvc_项目MVc
09-20
在“MVC.rar”这个压缩包中，包含了ASP.NET MVC 1.0到3.0版本的参考文档和测试项目，帮助我们深入理解这个框架的不同迭代和新特性。 首先，让我们看看ASP.NET MVC 1.0。这是ASP.NET MVC框架的首次正式发布，它引入...
锐浪asp.net MVC html5报表显示
09-15
锐浪ASP.NET MVC HTML5报表显示是针对Web应用开发中的数据呈现技术的一种实践。ASP.NET MVC（Model-View-Controller）框架是微软提供的一种用于构建可维护性高、测试性强的Web应用程序的模式。HTML5作为最新的超文本...
ASP.NET Core MVC基础学习之局部视图（Partial Views）
10-16
主要给大家介绍了关于ASP.NET Core MVC基础学习之局部视图（Partial Views）的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用ASP.NET Core MVC具有一定的参考学习价值，需要的朋友们下面来一起学习...
Pro ASP.NET MVC 5 源代码
09-08
《Pro ASP.NET MVC 5 源代码》是针对ASP.NET MVC 5框架的一本深入学习教程，旨在帮助初学者和开发者理解并掌握这一强大的Web应用程序开发技术。ASP.NET MVC是一个开源的、基于模型-视图-控制器（MVC）模式的框架，它...
MVC加载部分视图Partial
weixin_30627381的博客
05-31 209
加载部分视图的方法：Partial()、RenderPartial() 、 Action() 、RenderAction() 、 RenderPage() partial 与 RenderPartial 方法 Razor 语法： @Html.Partial() 与 @{Html.RenderPartial();} 区别：Partial 可以直接输出内容，它内部是将html内容转换...
html.partial mvc5,.net mvc5的 完整源码(深入学习MVC非常有用)
weixin_35171603的博客
06-18 157
【实例简介】【实例截图】【核心代码】// Copyright (c) Microsoft Open Technologies, Inc. All rights reserved. See License.txt in the project root for license information.using System.Diagnostics.CodeAnalysis;using System...
MVC |分部视图 PartialView()
热门推荐
Fanbin168的专栏
11-29 1万+
介绍如何定义 其实它和普通视图没有多大区别，只是创建分部视图的时候视图里没有任何内容，你需要什么标签你自己加。第二就是分部视图不会执行_ViewStart.cshtml中的内容） 控制器 PartialViewDeomController控制器 using System; using System.Collections.Generic; using System.Linq;
MVC中Html.Partial, RenderPartial, Action,RenderAction 区别
tangtiantian520的专栏
04-24 4813
1、  Html.partial和RenderPartial的区别 Html.partial和RenderPartial都是输出html片段，区别在于: @Html.Partial用于将分部视图渲染为字符串, 是将视图内容直接生成一个字符串并返回（相当于有个转义的过程）。@{Html.RenderPartial}方法是将分布视图直接写入响应输出流（当前 HttpContext）（因为是直接输出
MVC5 + EF6 + Bootstrap3 (14) 分部视图PartialView
weixin_30696427的博客
01-19 410
Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-partialview.html 系列教程：MVC5 + EF6 + Bootstrap3 上一节：MVC5 + EF6 + Bootstrap3 (13) 查看详情、编辑数据、删除数据 下一节：MVC5 + EF6 + Bootstrap3 (15)...
MVC之Partial View 用法
极客神殿
01-01 1万+
Partial View 顾名思义就是Html代码片段，因此可以用Partial View 把部分的Html或显示逻辑包装起来，方便多次使用。 Partial View 需要放在Views/Shared 目录下，任何Controlller 下的Action 或 View 都可以载入。 如何载入Partial View? MVC 的 HTML 辅助方法有个专门的方法载入分部View,方法名称为
MVC中使用PartialView返回部分HTML段
极客神殿
01-09 3838
在asp.net mvc中返回View时使用的是ViewResult,它继承自ViewResultBase 同时它还有个兄弟PartialViewResult相信聪明的你已经知道了它俩的区别了，没错 一个用于返回整体，另一个返回局部(部分)。假设我有这样一个需求，输入用户名，然后返回相关信息。之前的做法可能会是用json格式来返回用户的相关信息，然后到页面去渲染相关的HTML，如果产生的相关HTML
经济开发区智慧园区建设方案汇报.pptx
最新发布
08-13
经济开发区智慧园区建设方案汇报.pptx
精通ASP.NET MVC3.0：高级开发指南
5. **表单和HTML辅助方法** - ASP.NET MVC提供了一系列HTML辅助方法，帮助开发者生成HTML标记，同时保持代码的可读性和可维护性。这一章会讲解如何利用这些辅助方法进行表单处理，包括验证和数据绑定。 6. **扩展...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值