asp.net-mvc 如何使用 ASP.NET MVC 创建仪表板用户界面?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/293832/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-07 22:52:37  来源:igfitidea点击:

How to create a dashboard user interface using ASP.NET MVC?

asp.net-mvcuser-interfacedashboardweb-parts

提问by mattruma

I am currently building an application using ASP.NET MVC. The data entry pages are fairly easy to code, I just make the Model for the page of the type of my business object:

我目前正在使用 ASP.NET MVC 构建应用程序。数据输入页面相当容易编码,我只是为我的业务对象类型的页面创建模型:

namespace MyNameSpace.Web.Views.ProjectEdit
{
    public partial class MyView : ViewPage<Project>
    {
    }
}

Where I am struggling is figuring out the best way to implement a dashboard like interface, with stand-alone parts, using ASP.NET MVC, where the Model for each part would be different? I'm assumingthat each part would be an MVC user control.

我正在努力寻找实现仪表板之类的最佳方法,使用独立部分,使用 ASP.NET MVC,其中每个部分的模型会有所不同?我假设每个部分都是一个 MVC 用户控件。

Also, how could I make it so each part is testable?

另外,我怎样才能使每个部分都可以测试?

回答by tvanfosson

I think that user controls is probably the way to go. I'm not sure what the concern is about testability. You should be able to test that your controller is providing the right view data -- since you'll have several models each of these will probably be stored in a separate view data item, rather than aggregating them in a single model. Aggregating in a single model is also possible, although probably more brittle. Each control would just need to check for a particular view data item, rather than being specific to a particular model. You could approximate the model variable on each view page by doing:

我认为用户控制可能是要走的路。我不确定对可测试性的关注是什么。您应该能够测试您的控制器是否提供了正确的视图数据——因为您将有多个模型,每个模型可能会存储在一个单独的视图数据项中,而不是将它们聚合在一个模型中。在单个模型中聚合也是可能的,但可能更脆弱。每个控件只需要检查特定的视图数据项,而不是特定于特定模型。您可以通过执行以下操作来近似每个视图页面上的模型变量:

<% MyUserControlModel model = ViewData["MyUserControlModel"]
         as MyUserControlModel; %>

<div id="myUserControl_dashboard" class="dashboard">
   Name: <%= model.Name %><br />
   Count: <%$ model.Count %>
</div>

If you need to test your view, then you're probably already using Selenium or some other web testing framework. I don't think that these would care how the page was constructed and you should be able to construct your tests pretty much like you always do.

如果您需要测试您的视图,那么您可能已经在使用 Selenium 或其他一些 Web 测试框架。我不认为这些会关心页面是如何构建的,您应该能够像往常一样构建您的测试。

回答by Kyle West

Check out the notion is sub-controllers in MVC-Contrib http://www.codeplex.com/MVCContrib. Basically you run a full request to a partial then display that partial where you want in your existing code.

查看 MVC-Contrib http://www.codeplex.com/MVCContrib 中的子控制器的概念。基本上,您对部分运行完整请求,然后在现有代码中您想要的位置显示该部分。

Alternatively you can check out this post: http://blog.codeville.net/2008/10/14/partial-requests-in-aspnet-mvc/

或者你可以看看这篇文章:http: //blog.codeville.net/2008/10/14/partial-requests-in-aspnet-mvc/

回答by kannankeril

Codeplex.com has an open source project "DotNet.Highcharts". This project provides an ASP.NET control that wraps around the excellent (free for personal use) Highcharts charting library. that includes a sample MVC3 project in the downloads section.

Codeplex.com 有一个开源项目“DotNet.Highcharts”。这个项目提供了一个 ASP.NET 控件,它包含了优秀的(免费供个人使用的)Highcharts 图表库。其中包括下载部分中的示例 MVC3 项目。

URL: http://dotnethighcharts.codeplex.com/

网址:http: //dotnethighcharts.codeplex.com/

I have posted an article on CodeProject.com that includes a downloadable VS2012 solution and some sample C# code. However I use a webform template in my example, not MVC. The bulk of the dashboard is done using JavaScript libraries, HTML & CSS. I have included some sample C# code to demo data retrieval in C# which in then merged with JavaScript code to render one of the many dashboard charts.

我在 CodeProject.com 上发表了一篇文章,其中包括可下载的 VS2012 解决方案和一些示例 C# 代码。但是,我在示例中使用了 webform 模板,而不是 MVC。仪表板的大部分是使用 JavaScript 库、HTML 和 CSS 完成的。我已经包含了一些示例 C# 代码来演示 C# 中的数据检索,然后将其与 JavaScript 代码合并以呈现许多仪表板图表之一。