当前位置: 首页 > 工具软件 > eWebEditor > 使用案例 >

eWebEditor的使用

闽焕
2023-12-01

 


一、下载并配置 eWebEditor 控件

下载完毕后,将压缩包进行解压,然后移动到站点所在目录(如F:\news\edit\)的任何位置中。这里将其保存到站点news根目录下面的edit文件夹中。

这样便完成了eWebEditor控件的下载及其配置。可以看到,该控件的使用其实非常方便,用户只需将其释放到站点目录下,而无需在 IIS 服务器中进行任何的设置。

二、了解 eWebEditor 控件

       eWebEditor 控件是一个所见即所得的在线编辑器,它可以和前台中的文本域或隐藏域表单控件进行绑定,并且实现控件之间数据的传递与交互。

       要实现 eWebEditor 与表单控件的通信,用户必须首先了解一下该控件的通信编程接口。简单来说,就是要知道如何在网页中调用该控件。

调用:

eWebEditor的调用是非常简单,基本上只是在原来的使用中加入一行代码。

 

标准调用语句:

<iframe ID="eWebEditor1" src="/ewebeditor.htm?id=content1&style=standard" frameborder="0" scrolling="no" width="500" HEIGHT="350">

</iframe>

 可以看到,这是一个iframe表单控件,也是平时所说的浮动框架。该控件包括了6个参数,下面将分别对其进行一一说明,具体见附录表一。

附录表一  相关参数说明


参数名称


说明


ID


用于在网页标识iframe浮动框架,从而区别其同类的表单控件


src


用于调用eWebEditor控件。其中,用户须将"/ewebeditor.asp"替换为eWebEditor控件在站点中的实际路径。例如将其保存到站点news根目录下面edit文件夹后,则


"/ewebeditor.asp"须相应更改为"edit/ewebeditor.asp"


需要注意的是,"ewebeditor.asp"后面还附带两个URL变量,其名称分别为"id"和"style"。


其中,该变量的意义分别为:


(1)id:用于相关联的保存编辑内容的表单控件名,也就是与eWebEditor控件绑定的表单控件名称


(2)style:使用的样式名,可以是标准的样式名(standard)或自定义的样式名


frameborder


用于设置iframe浮动框架的边框,其值只能为0或1。


当frameborder等于0时,表示无边框;等于1时,则表示显示框架的边框


scrolling


用于设置iframe浮动框架是否出现滚动条。它有3个值,分别为no、auto和yes。当frameborder


等于no的时候,表示没有滚动条:当为yes时,则表示有滚动条。如果为auto时,则当浮动框


架内设的高度或长度小于嵌入到框架内对象的高度或长度时,出现滚动条


width


用于设置iframe浮动框架的宽度


height


用于设置iframe浮动框架的高度


参数说明:

·         /ewebeditor.asp应改为你实际安装的路径

·         参数id:相关联的表单项名,也就是提交保存页要引用的表单项名,多个调用时,请保证id不同,可参见后面例子

·         参数style:使用的样式名,可以是标准的样式名或自定义的样式名,如果使用标准standard可留空

·         width,height:根据实际需要设置,eWebEditor将自动调整与其适应

·         在后台管理中,可以得到每个样式的最佳调用代码所有入口参数:(即:eWebEditor.asp?后面的参数)

了解 eWebEditor 控件调用的相关参数设置后,用户便可以根据自身的需要定制在线编辑器的样式、外观,以及和哪个表单控件进行绑定。

 

 

下面将根据新闻发布系统制作的需要,定义在线编辑器的高度、宽度和样式分别为350、550和standard,并且它与一个名称为”news”的隐藏域进行绑定。那么,根据参数定义,其完整的调用语句如下:

<iframe ID="eWebEditor1" src="edit/ewebeditor.htm?id=news&style=standard" frameborder="0" scrolling="no" width="500" HEIGHT="350">

</iframe>

三、建立表单控件并绑定 eWebEditor控件

eWebEditor 控件相当于一个功能模块,它可以和“文本域”和“隐藏域”这两种表单控件进行绑定。不过,由于这两种绑定方式的实现原理是一致的,所以下面将以“隐藏域”为调用表单控件,简要介绍表单控件和 eWedEditor 控件的绑定。

(1)、打开新闻添加页面 (addnew.asp), 然后在新闻内容左侧的单元格中插入一个隐藏域,并设置其名称为 "news"。

(2)、将鼠标焦点定位于隐藏域的右侧,然后切换到“代码”视图,在当前的位置中输入下列的代码片断:

<iframe ID="eWebEditor1" src="edit/ewebeditor.htm?id=news&style=standard" frameborder="0" scrolling="no" width="500" HEIGHT="350">

</iframe>

可以看到,上面代码片断中的URL参数id的值为”news”,它和隐藏域的名称是一致的。这样便完成了表单控件与eWebEditor控件的绑定。

四、提交表单数据

切换到“服务器行为”控制面板,单击+按钮,然后在下拉菜单中选择“插入记录”命令。最后,在弹出的“插入记录”对话框中,进行参数设置。

可以看到,新闻内容字段所对应的表单控件为名称为“news”的隐藏域,其他的参数设置则保持不变。这样,用户便无需考虑 eWebEditor 控件的执行原理,而只需将其绑定到其他表单控件便可以了。

五、输出新闻内容

       数据提交到后台数据库后,在新闻详细页面(showdetail.asp) 中,用户只需将字段 "content" 绑定到页面的相应位置中便可以了,无需设置新闻内容在输出到页面之前必须通过HTMLcode() 函数。

 类似资料: