在线客服:  

「南宁烟寒网络」提供南宁网站建设、网站策划、南宁网页制作、网站设计、网站改版、南宁SEO优化、网站维护、南宁网站优化、南宁网站推广、广告设计等服务..

咨询热线

在线客服

24小时免费咨询电话:18978941786

客服时间:上午9:30~下午6点

当前位置:首页>> 技术文章 >> NET学习 >> CuteEditor的安装及它与Ajax.net配合无刷新操作数据库!

CuteEditor的安装及它与Ajax.net配合无刷新操作数据库!

收藏 分享 发布日期:2012-2-12 16:30:51    编辑:admin  文章来源:  点击率:

CuteEditor的安装及它与Ajax.net配合无刷新操作数据库!

 

在VS2005中引入CuteEditor组件

CuteEditor真的是一款很好的web在线编辑器,我们在vs2005里面新建个网站.引用CuteEditor文件夹下的BIN目录中的所有.dll文件,接着把CuteEditor.dll添加到工具面板.我们在工具面板里面右键选择"选择项",在出来的对话框里面选择"浏览",找到CuteEditor.dll,一路确定就可以.
一、直接把CuteSoft_Client文件夹放到网站根目录下,这个文件夹是放了控件图片之类数据。(在2.0下可能要把dialog文件夹里面的getfilethub.aspx删除);
二、打开:CuteSoft_Client/CuteEditor/Configuration/Security,修改“Default.config”文件;
三、对Default.config进行常用属性设置:

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<security name="RestrictUploadedImageDimension">true</security>   //是否限制上传图象尺寸
<security name="OverWriteExistingUploadedFile">false</security>   //如果上传的文件已经存在,是否将其覆盖
<security name="AutoResizeUploadedImages">true</security>   //是否自动调整上传图象
<security name="MaxImageWidth">1024</security>   //上传图象的最大宽度
<security name="MaxImageHeight">768</security>   //上传图象的最小宽度
<security name="MaxImageSize">1000</security>   //上传图象文件的最大值
<security name="MaxMediaSize">100</security>   //上传媒体文件的最大值
<security name="MaxFlashSize">100</security>   //上传Flash文件的最大值
<security name="MaxDocumentSize">10000</security>   //文档最大值
<security name="MaxTemplateSize">1000</security>   //模板最大值
<security name="ImageGalleryPath">~/uploads</security>   //图象文件上传路径
<security name="MediaGalleryPath">~/uploads</security>   //媒体文件上传路径
<security name="FlashGalleryPath">~/uploads</security>   //Flash文件上传路径
<security name="TemplateGalleryPath">~/templates</security>   //模板路径
<security name="FilesGalleryPath">~/uploads</security>   //文件库路径
<security name="MaxImageFolderSize">102400</security>   //图象文件夹最大值
<security name="MaxMediaFolderSize">102400</security>   //媒体文件夹最大值
<security name="MaxFlashFolderSize">102400</security>   //Flash文件夹最大值
<security name="MaxDocumentFolderSize">102400</security>   //文档文件夹最大值
<security name="MaxTemplateFolderSize">102400</security>   //模板文件夹最大值
<security name="ThumbnailWidth">80</security>   //最小宽度
<security name="ThumbnailHeight">80</security>   //最小高度
<security name="ThumbnailColumns">5</security>   //最小列数
<security name="ThumbnailRows">3</security>   //最小行数
<security name="AllowUpload">true</security>   //是否允许上传
<security name="AllowModify">true</security>   //是否允许修改
<security name="AllowRename">true</security>   //是否允许重命名
<security name="AllowDelete">true</security>   //是否允许删除
<security name="AllowCopy">true</security>   //是否允许复制
<security name="AllowMove">true</security> <!-- this is rename too -->   //是否允许移动
<security name="AllowCreateFolder">true</security>   //是否允许创建文件夹
<security name="AllowDeleteFolder">true</security>   //是否允许删除文件夹
<security name="ImageFilters">   //这里过滤(设置)图象文件格式
   <item>.jpg</item>
   <item>.jpeg</item>
   <item>.gif</item>
   <item>.png</item>
</security>
<security name="MediaFilters">   //这里过滤(设置)媒体文件格式
   <item>.avi</item>
   <item>.mpg</item>
   <item>.mpeg</item>
   <item>.mp3</item>
</security>
<security name="DocumentFilters">   //这里过滤(设置)文档文件格式
   <item>.txt</item>
   <item>.doc</item>
   <item>.pdf</item>
   <item>.zip</item>
   <item>.rar</item>
   <item>.avi</item>
   <item>.mpg</item>
   <item>.mpeg</item>
   <item>.swf</item>
   <item>.jpg</item>
   <item>.jpeg</item>
   <item>.gif</item>
   <item>.png</item>
   <item>.htm</item>
</security>
</configuration>

五、在根目录下建立Uploads的文件夹作为上传图片及附件的根目录

六、example.css放在站点根目录下,它指定了编辑器的样式。

七、控件的调用代码:
<%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>

<CE:EDITOR id="Editor1" runat="server" Width="550px" EditorWysiwygModeCss="../example.css"></CE:EDITOR>
 


可修改文件CuteSoft_Client\\CuteEditor\\Configuration\\Shared\\Common.config来添加字体。

 以上内容均来自网上。。。。。。。。。。。。。。

我的小结:
一、CuteSoft_Client\CuteEditor\Dialogs\InsertEmotion.htm文件可按页面的格式添加表情,
二、CuteSoft_Client\CuteEditor\Configuration\Shared\Common.config 可配置以下内容:
 1、代码片断: 找到文件中的Codes节点,添加一个item节点,按它的格式,添加value和 html
 2、连接:找到文件中LinkTree节点,不难看出它是连接中那个树形结构的配置,item中可以包含item,可按它的格式写出更多。
  如:
   <item text="deng" value="http://pointdeng.cnblogs.com/">
               <html><![CDATA[hi:pointdeng]]></html>
           </item>
 3、Images:找到文件中Images节点,添加相应item节点,
 三、在一个网站中,肯定会有很多的人,那么这些人自己上传的文件怎么管理呢?经过查找之后发现原来控件可以设定相关文件的路径的,
  Editor1.AutoConfigure枚举设定风格
  Editor1.SetSecurityImageGalleryPath(path);图片文件路径
  Editor1.SetSecurityMediaGalleryPath(path);多媒体文件路径 
         Editor1.SetSecurityGalleryPath(path);没明白这是什么,不过都设一样吧。
         Editor1.SetSecurityFilesGalleryPath(path);可下载文件路径
           这里的path我是按用户名建不同的文件夹的,也许还有更好的办法/
    还有很多的方法,如Editor1.MaxHTMLLength可以限定输入的长度等,,,,,

我们再添加个edit.asxp,把工具面板里面的Editor拖到页面上来.就可以进行编辑了
上面的只是个最简单的安装,还有比如控制CueEditor的显示,已经安全性和那个什么上传的啊,还有控制用户上传的目录啊,或者给每个用户建个他们自己的图片目录啊,还必须要另外设置,

 
用Ajax.Net来把CuteEditor的内容插入数据库
要实现这一功能,必须先构建环境,先安装Ajax.net扩展包,我们可以登录Ajax.net官方网站下载Ajax.net扩展包。地址:http://ajax.asp.net/downloads/default.aspx?tabid=47
还要把AjaxPro.2.dll引入到网站中下载地址是:
http://www.schwarz-interactive.de


如何把CueEditor里面的内容用Ajax插入数据库呢?首先关键是获得CuteEditor的客户端ID,这个可以通过<%=Editor1.ClietID%>来获得.再就是如何在客户端获得Editor里面的内容.这个可以使用他的内在的JavaScript API,getHTML(),注意是HTML.下面是一个把CuteEditor的内容插入数据库的一个html按钮代码:
<input id="btnOk" type="button" value="确定" onclick="insertEditor();" />
接着是一个js脚本:我们假设Editor的ID是Editor1
<script language="javascript" type="text/javascript">
     <!--
        function insertEditor()
        {
           var editor = document.getElementById('<%=Editor1.ClientID %>');
           var editorText = editor.getHTML();
           WDDHY.EditMyPage.InsertEditor(editorText,onComplete);
        }
        function onComplete(ret)
        {
           if(ret.value=="OK")
           {
              alert("保存成功!");
           }
           else
           {
              alert("失败!");
           }
        }
     //-->
    </script>
我们再看服务器段的Ajax方法:
[AjaxPro.AjaxMethod]
        public string InsertEditor(string insertStr)
        {
            string connStr = System.Configuration.ConfigurationManager.AppSettings["ConnString"].ToString();
            SqlConnection conn = new SqlConnection(connStr);
            string cmdStr = "insert into userContent(this_content,this_name) values(@content,@name)";
            SqlCommand comm = new SqlCommand(cmdStr,conn);
//2005里面给参数赋值简单多拉!!
            comm.Parameters.AddWithValue("@content", insertStr);
            comm.Parameters.AddWithValue("@name","pwqzc");
            conn.Open();
            try
            {
                comm.ExecuteNonQuery();
                return "OK";
            }
            catch
            {
                return "BAD";
            }
            finally
            {
                conn.Close();
            }
运行,我们写点 内容到CuteEditor里面,点按钮,他一下就把数据插入进去拉!!! 本文章由南宁网站建设南宁网站优化南宁网络公司整理,转载请注明出处:http://www.xqgg.net/

南宁烟寒网络竭诚为您免费提供南宁网站建设南宁网站设计南宁网站优化、维护以及网站技术很方面的网络服务!

南宁网站建设南宁网络公司咨询热线电话:0771-5306126 18967841786(24小时全天电话)

烟寒网络 - 让你进一步走向成功