.NET快速信息化系统开发框架 V3.2-Web版本“产品管理”事例编辑界面新增KindEditor复文本编辑控件

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/chinahuyong/article/details/77942343   KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/chinahuyong/article/details/77942343

  KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。KindEditor使用JavaScript编写,可以无缝的于Java、.NET、PHP、ASP等程序接合。KindEditor非常适合在CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用,2006年7月首次发布2.0以来,KindEditor依靠出色的用户体验和领先的技术不断扩大编辑器市场占有率,目前在国内已经成为最受欢迎的编辑器之一。

  我们在开始过程中经常需要富文本框的支持,应有些客户的需求,在案例模块“产品管理”中增加了对KindEditor富文本框控件的支持。KindEditor富文本框控件的下载地址在文章的最后,需要的用户可以下载。

  产品管理主界面如下图所示: 


  在产品管理主界面单击编辑按钮,打开产品编辑界面,在编辑界面的描述字段我们就用了KindEditor控件,如下图所示:


  使用方法如下图代码所示:

   1、引用KindEditor控件相关css与js到界面中,如下:

<link rel="stylesheet" href="~/Content/Scripts/kindeditor/themes/default/default.css" />
<script charset="utf-8" src="~/Content/Scripts/kindeditor/kindeditor.js"></script
<script charset="utf-8" src="~/Content/Scripts/kindeditor/lang/zh_CN.js"></script>  

2、 定义需要设置为KindEditor控件的html控件,如下:

<textarea style="width:300px;height:30px;" id="PRODUCTDESCRIPTION" name="PRODUCTDESCRIPTION" />  

3、在界面加载时指定关联,如下代码: 

<script type="text/javascript">
        $(function(){
                window.editor = KindEditor.create('#PRODUCTDESCRIPTION', {
                resizeType: 1,
                width: '500px',minWidth:'490px',height:'50px',
                urlType: 'domain', // 带有域名的绝对路径
                allowFileManager: false,
                items: ['source', 'undo', 'redo', 'wordpaste', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist', 'formatblock', 'fontname', 'fontsize', 'forecolor', 'bold', 'italic', 'table', 'link', 'unlink', 'image']
            });
        });   
</script>   

4、对于具体的KindEditor控件的各参数与属性说明可以参考该控件的官方网站说明即可。 


相关文章:   

     KindEditor富文本框控件下载地址

     KindEditor富文本框控件在线测试地址

     RDIFramework 平台代码生成器V3.2 发布版 

   RDIFramework.NET — 基于.NET的快速信息化系统开发框架 — 系列目录  

   RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件介绍 

  一路走来数个年头,感谢RDIFramework.NET框架的支持者与使用者,大家可以通过下面的地址了解详情。 

      RDIFramework.net官方网站:http://www.rdiframework.net/ 

      RDIFramework.Net官方博客:http://blog.rdiframework.net/ 

      同时需要说明的,以后的所有技术文章以官方网站为准,欢迎大家收藏! 

      RDIFramework.NET框架由专业团队长期打造、一直在更新、一直在升级,请放心使用!  

     
 
相关文章
|
9天前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
|
10天前
|
数据可视化 网络协议 C#
C#/.NET/.NET Core优秀项目和框架2024年3月简报
公众号每月定期推广和分享的C#/.NET/.NET Core优秀项目和框架(每周至少会推荐两个优秀的项目和框架当然节假日除外),公众号推文中有项目和框架的介绍、功能特点、使用方式以及部分功能截图等(打不开或者打开GitHub很慢的同学可以优先查看公众号推文,文末一定会附带项目和框架源码地址)。注意:排名不分先后,都是十分优秀的开源项目和框架,每周定期更新分享(欢迎关注公众号:追逐时光者,第一时间获取每周精选分享资讯🔔)。
|
25天前
|
网络协议 Java Nacos
nacos常见问题之在web界面 上下线服务时报错 400如何解决
Nacos是阿里云开源的服务发现和配置管理平台,用于构建动态微服务应用架构;本汇总针对Nacos在实际应用中用户常遇到的问题进行了归纳和解答,旨在帮助开发者和运维人员高效解决使用Nacos时的各类疑难杂症。
29 0
|
14天前
|
编解码 前端开发 开发者
构建响应式Web界面:Flexbox与Grid布局的深度对比
【4月更文挑战第4天】 在现代前端开发中,构建灵活且响应式的用户界面是至关重要的。随着移动设备浏览量的增加,能够适应不同屏幕尺寸和分辨率的布局技术变得必不可少。Flexbox和Grid是CSS提供的两种强大的布局机制,它们各自以独特的方式解决了响应式设计的挑战。本文将深入探讨Flexbox和Grid的核心概念、使用场景和性能考量,为开发者提供在面对不同布局需求时做出明智选择的依据。
|
28天前
|
开发框架 网络协议 .NET
深入.net框架
深入.net框架
11 0
|
30天前
|
编解码 前端开发 开发者
构建响应式Web界面:Flexbox的力量
【2月更文挑战第28天】 在现代网页设计中,创建能在不同设备上保持一致性和功能性的响应式界面是至关重要的。Flexbox,一个CSS布局模块,为前端开发者提供了强大工具来轻松实现灵活的布局设计。本文将深入探讨Flexbox的核心概念、使用场景以及如何通过它来优化响应式设计流程。
|
30天前
|
前端开发 开发者 UED
构建响应式Web界面:Flexbox与Grid布局的深度解析
【2月更文挑战第28天】 在现代前端开发中,打造灵活且适应不同屏幕尺寸的用户界面是至关重要的。随着移动设备的普及,响应式设计已经成为网页制作不可或缺的一部分。本文将深入探讨两种强大的CSS布局模块——Flexbox和Grid,它们如何简化布局创建过程,并赋予设计师更大的灵活性去构建动态和流畅的响应式界面。通过对这两种技术的比较、使用场景分析以及代码示例,读者将能够更好地理解何时以及如何使用这些工具来提升前端项目的质量和效率。
16 0
|
30天前
|
编解码 前端开发 开发者
构建响应式Web界面:Flexbox布局的全面指南
【2月更文挑战第28天】 在当今多变的设备屏幕尺寸和分辨率中,创建一个能够适应不同视口的响应式Web界面至关重要。本文深入探讨了CSS Flexbox布局模块,它是一种设计灵活且强大的方式来创建复杂的响应式布局。我们将透过概念解析、关键属性讲解以及实际案例分析,帮助前端开发者掌握Flexbox的核心原理和应用技巧,以实现流畅的页面布局调整和优化用户体验。
|
1月前
|
编解码 前端开发 JavaScript
构建响应式Web界面:现代前端开发的最佳实践
【2月更文挑战第26天】在多设备浏览时代,响应式网页设计已成为前端开发的核心。本文将深入探讨如何通过灵活布局、媒体查询和现代框架,实现跨平台的用户界面一致性。我们将剖析响应式设计的原则,并展示如何结合最新技术栈,包括CSS Grid和Flexbox,以及JavaScript框架如React和Vue,来优化前端性能和用户体验。
32 5
|
3月前
|
开发框架 前端开发 .NET
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
38 0