DevExpress的web Dashboard应用

本文旨在从零开始创建一个包含dashboard的应用

一、前期准备

        1、语言:C#

        2、软件:Visual Studio 2019

        3、框架:DevExpress19.2(付费)、ASP.NET(Web)

        4、组件:dashboard

二、创建ASP.NET Web窗体仪表板应用程序

        1、创建一个空的web应用

打开VS,创建新项目,选择ASP.NET Web应用程序,点击下一步

配置新项目:项目名,位置选择,框架选择为(4.5.2版本)

        2、添加引用

右键“引用”——>“添加引用”——>程序集——>扩展选择与dashboard相关的拓展(Mvc和Mvc5选一个就行)——>确定

        3、创建一个Web窗体

右键“web名”——>“添加”——>Web窗体。点击,命名。

        4、引入Dashboard

打开新创建的web窗体:右键“web窗体”——>查看设计器

 打开“工具箱”——>找到“dashboard”——>把组件拉出来到web窗体的设计器上。

        5、创建仪表板存储文件夹

创建DATA文件夹:右键“项目名”——>“添加”——>“添加ASP.NET文件夹”——>APP_DATA文件夹

在APP_DATA中创建Dashboards文件夹,在ASPxDashboard1的属性中找到属性“Dashboard Storage Folder ”:~/App_Data/Dashboards

        6、添加数据 

右键单击App_Data文件夹,选择Add | 添加现有项,并使用以下路径找到nwind.mdb数据库: C:\Users\Public\Documents\DevExpress Demos 19.2\Components\Data\nwind.mdb(若是按路径查找依次为:c盘,用户,公用,公用文档,...)

在Web.config文件中添加数据库链接的代码(位置和代码如下,代码根据数据库类型变化而变化):

	<connectionStrings><add name="sqlServerConnection"connectionString="Server=192.168.1.52; DataBase=test1; Uid=xiaoyu; PWD=Rr2577588052;" /></connectionStrings>

打开Web窗体文件的代码:右键“Web窗体”——>查看代码——>编写代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;namespace WebApplication4
{public partial class WebForm1 : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){ASPxDashboard1.SetConnectionStringsProvider(new DevExpress.DataAccess.Web.ConfigFileConnectionStringsProvider());}}
}

7、添加所需的客户端库

在Web.config文件中添加资源代码(位置和代码如下):

<!-- ... --><resources><add type="ThirdParty" /><add type="DevExtreme" /></resources>

 8、运行

将web窗体设为起始页:右键“web窗体”——>设为起始页

点击运行: 

 三、切换查看器模式

设置属性“WorkingMode”:ViewerOnly(这个属性会使得仪表盘在Web端不可编辑,可有可无即:查看器模式)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/62263.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

记录下在html文件中如何直接使用npm依赖,以threejs为例

参考&#xff1a; https://www.cnblogs.com/shayloyuki/p/17191489.html 共三种方式 我的代码截图 方式一&#xff1a; threejsDemo_script.html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name&…

SpringMVC-Day1

SpringMVC 1.SpringMVC介绍 springMVC是一种基于Java实现MVC模型的轻量级Web框架 优点&#xff1a; 使用简单&#xff0c;开发便捷&#xff08;相较于Servelt&#xff09; 灵活性强 使用SpringMVC技术开发web程序流程 创建web工程&#xff08;Maven结构&#xff09; 设置…

鸿蒙面试 --- 性能优化

性能优化可以从三个方面入手 感知流畅、渲染性能、运行性能 感知流畅 在应用开发中&#xff0c;动画可以为用户界面增添生动、流畅的交互效果&#xff0c;提升用户对应用的好感度。然而&#xff0c;滥用动画也会导致应用性能下降&#xff0c;消耗过多的系统资源&#xff0c;…

C#变量和函数如何和unity组件绑定

1.Button On_click (1)GameObject通过Add component添加上Script (2)Button选GameObject组件而不是直接选Script,直接选Script出现不了Script中的函数 2.RawImage 上面是错的 3.Text 上面是错的&#xff0c;应该是直接在GameObject里面填上对应的值 总结&#xff1a; …

el-dialog中调用resetFields()方法重置表单报错

前言 在开发中&#xff0c;弹框和表单是两个常见的组件&#xff0c;它们通常一起使用以实现用户交互和数据输入。然而&#xff0c;当我们尝试在弹框中调用表单的 resetFields() 方法时&#xff0c;有时会遇到报错的情况。 一、用法错误 确保 this.$refs[ruleForm].resetFields…

TCP网络套接字

引言 前面我们已经介绍了udp套接字的相关编写&#xff0c;本文主要介绍TCP套接字的相关接口和一些相关知识&#xff0c;方便大家后续对TCP的进一步理解。 相关接口 1、socket 这个接口我们已经在前面有所了解&#xff0c;这里我们再重新回顾一下 第一个参数我们依然使用AF…

rustdesk 自建服务

RustDesk 部署RustDesk sudo docker image pull rustdesk/rustdesk-server sudo docker run --name hbbs -p 21115:21115 -p 21116:21116 -p 21116:21116/udp -p 21118:21118 -v pwd:/root -td --nethost rustdesk/rustdesk-server hbbs sudo docker run --name hbbr -p 2111…

Java面试问答FAQ

目录&#xff1a; 1、post为什么会发送两次请求&#xff1f;2、单核CPU支持多线程吗&#xff1f;3、ConcurrentHashMap 如何保证线程的安全性&#xff1f; 1、post为什么会发送两次请求&#xff1f; A&#xff1a;那是因为浏览器的安全策略&#xff08;同源策略&#xff09;决…

【一篇搞定配置】网络分析工具WireShark的安装与入门使用

&#x1f308; 个人主页&#xff1a;十二月的猫-CSDN博客 &#x1f525; 系列专栏&#xff1a; &#x1f3c0;各种软件安装与配置_十二月的猫的博客-CSDN博客 &#x1f4aa;&#x1f3fb; 十二月的寒冬阻挡不了春天的脚步&#xff0c;十二点的黑夜遮蔽不住黎明的曙光 目录 1.…

11.28周四F34-Day9打卡

文章目录 1. 你需要的是更多的练习。解析答案:【解析答案分析】【拓展内容】2. 跟我说说你昨天买什么了。解析答案:【解析答案分析】3. 他跟你说的是错的。解析答案:【解析答案分析】【对比分析】4. 原因是她没有通过考试。解析答案:【解析答案分析】5. 你说的和他告诉我们…

JavaSE——类与对象(3)

一、方法重写 简单来讲&#xff0c;方法重写就是一个子类有一个方法&#xff0c;和父类的某个方法的名称&#xff0c;返回类型&#xff0c;参数一样&#xff0c;那么我们就说子类的这个方法覆盖了父类的那个方法。比如说&#xff1a; class Animal {public void makeSound() {…

RK3568平台开发系列讲解(DMA篇)什么是DMA

🚀返回专栏总目录 文章目录 一、什么是DMA二、DMA的产生:背景三、理解 DMA:协处理器沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇将带领大家深刻理解DMA。 一、什么是DMA DMA (Direct Memory Access) is used to copy data directly between devices and R…

AD20使用操作第三部分

常见CHIP封装的创建 SOD-123 第一个&#xff0c;顶视图&#xff0c;第二个&#xff0c;侧视图&#xff0c;第三个&#xff0c;侧视图。 E表示&#xff1a;丝印的本体 D表示&#xff1a;宽度 b&#xff1a;焊盘的宽度 A&#xff1a;高度 L:管脚长度 PCB焊盘&#xff1a;焊接器…

flink学习(6)——自定义source和kafka

概述 SourceFunction:非并行数据源(并行度只能1) --接口 RichSourceFunction:多功能非并行数据源(并行度只能1) --类 ParallelSourceFunction:并行数据源(并行度能够>1) --接口 RichParallelSourceFunction:多功能并行数据源(并行度能够>1) --类 【建议使用的】 ——…

ubuntu安装chrome无法打开问题

如果在ubuntu安装chrome后&#xff0c;点击chrome打开没反应&#xff0c;可以先试着在terminal上用命令打开 google-chrome 如果运行命令显示 Chrome has locked the profile so that it doesnt get corrupted. If you are sure no other processes are using this profile…

Ansible--自动化运维工具

Ansible自动化运维工具介绍 1.Ansible介绍 Ansible是一款自动化运维工具&#xff0c;基于Python开发&#xff0c;集合了众多运维工具&#xff08;puppet、cfengine、chef、func、fabric&#xff09;的优点&#xff0c;实现了批量系统配置、批量程序部署、批量运行命令等功能。…

软件工程相关-用PD画类图-设置方法的参数

前提&#xff1a;pd16安装完成&#xff0c;已经画好了类 1、为类添加方法。 2、双击方法&#xff0c;如下图所示 3、此时会有弹窗&#xff0c;选择参数栏&#xff0c;按需求进行设置。 &#xff08;总是忘记&#xff0c;故记录下自用

IT人日常健康工作生活方案

1. 早餐(7:00-8:00) 早餐是一天中最重要的一餐,提供充足的能量来启动新的一天。根据亚洲饮食的特点,我们加入了米饭、豆腐、蔬菜等传统食材,同时保持高蛋白、低糖的原则。 糙米粥或小米粥(1碗):低GI碳水化合物,有助于稳定血糖,提供持久能量。可加入少量的红枣、枸杞…

Qt配置Opencv环境

下载opencv后配置环境变量(官网下载&#xff09; 然后ok了

MongoDB相关问题

视频教程 【GeekHour】20分钟掌握MongoDB Complete MongoDB Tutorial by Net Ninja MongoDB开机后调用缓慢的原因及解决方法 问题分析&#xff1a; MongoDB开机后调用缓慢&#xff0c;通常是由于以下原因导致&#xff1a; 索引重建&#xff1a; MongoDB在启动时会重建索引…