最近项目要实现一个新闻发布的功能,要实现图文混排存储入数据库,再取出来进行页面展示的效果,于是网上搜了一个资料,在这里做一下总结,百度富文本编辑器有Java,php,.net三个版本,这里我下载的.net版本的,下载地址:http://ueditor.baidu.com/website/download.html
1、下载后要先看一下ueditor.config.js和asp/config.json的文件,里面是关于图片上传和其他方法的一些路径配置:
ueditor.config.js文件:
上传图片路径的配置文件asp/config.json
2、显示编辑页面(一定要看使用文档:http://fex.baidu.com/ueditor/#server-deploy)
(1)引入所需要的js文件
(2)初始化编辑器,html代码:
JavaScript代码:
说明修改配置项的方法:
方法一:修改ueditor.config.js里面的toolbars
方法二:实例化编辑器的时候传入toolbars参数(详情参考:http://fex.baidu.com/ueditor/#start-toolbar)
3、前端配置基本上配置好了,下面是后端配置(如果后端配置不好,上传图片功能将无法使用),在提交内容的时候我也遇到了一个坑了我一天的问题,由于是.NET的WinForm,点击按钮提交的时候,页面会整个刷新,所以富文本框内输入的值,由于页面的刷新传入后端的会是空值,我这里解决的方法是把富文本编辑器的赋值语句写到一个js的方法里面,然后把值存到一个隐藏域里面,把提交按钮放到UpdatePanel里面,只刷新按钮,不刷新页面其他部分,点击按钮执行提交之前,先执行这个js方法,取到富文本编辑器里面的值以后再执行存储数据库的操作,具体代码如下:
news_publish.aspx
<%@ Page ValidateRequest="false" Title="新闻发布" Language="C#" MasterPageFile="~/LJMB/MB01/MP01.master" AutoEventWireup="true" CodeFile="news_publish.aspx.cs" Inherits="LJWY_MG00_news_publish" %>
<%--2. 组合页面按钮--%>
<%--
#region 2. 页面加载
///
/// 页面加载事件
///
///
///
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//给btnQuery添加客户端事件
btnQuery.Attributes.Add("OnClick", "return UserAddVerify()");
//设置菜单编号
pgMenuId = "401101";
PgFnInitial();
}
}
#endregion //2. 页面加载
#region 3. 页面事件
#region 3.1 按钮事件
///
/// 按钮事件
///
///
///
protected void btnEvent_Click(object sender, EventArgs e)
{
#region 得到事件类别
string strCMNA = "";
strCMNA = ((LinkButton)(sender)).CommandName.ToString();
#endregion 得到事件类别
#region 保存按钮事件
if (strCMNA == "Save")
{
#region 变量定义
string strTableName = "OC11HN";
ArrayList aryInsertFiled = new ArrayList();
ArrayList aryInsertValues = new ArrayList();
string strTableNamehd = "OC11DB";
ArrayList aryInsertFiledhd = new ArrayList();
ArrayList aryInsertValueshd = new ArrayList();
string strSYID = "";
string strCTID = "";
string strCTNA = "";
string strCTFG = "";
string strCTTY = "";
string strCTY1 = "";
string strCTY2 = "";
string strCTDT = "";
string strPBTM = "";
string strCTOW = "";
string strATFG = "";
string strCTIT = "";
string strCIFG = "";
string strCITX = "";
#endregion //变量定义
#region 变量赋值
strSYID = "FRPL";
strCTID = objDrFn.GetFlowNo("FRPL", "XWGL", "XWID");
strCTNA = "二级页面";
strCTFG = "Y";
strCTTY = "精彩剪影";
strCTY1 = "精彩剪影";
strCTY2 = ddlCTY2.SelectedValue.ToString().Trim();
strCTDT = DateTime.Now.ToString("yyyyMMdd");
strPBTM = DateTime.Now.ToString("yyyy-MM-dd");
strATFG = "Y";
strCTOW = txtCTOW.Text.ToString().Trim();
strATFG = "Y";
strCTIT = "001";
strCIFG = "Y";
//strCITX = hidInput.Value;
strCITX = HiddenField1.Value;
#endregion //变量赋值
#region 变量处理
strSYID = objDrFn.FmatStr(strSYID);
strCTID = objDrFn.FmatStr(strCTID);
strCTNA = objDrFn.FmatStr(strCTNA);
strCTFG = objDrFn.FmatStr(strCTFG);
strCTTY = objDrFn.FmatStr(strCTTY);
strCTY1 = objDrFn.FmatStr(strCTY1);
strCTY2 = objDrFn.FmatStr(strCTY2);
strATFG = objDrFn.FmatStr(strATFG);
strCTDT = objDrFn.FmatStr(strCTDT);
strPBTM = objDrFn.FmatStr(strPBTM);
strCTOW = objDrFn.FmatStr(strCTOW);
strATFG = objDrFn.FmatStr(strATFG);
strCTIT = objDrFn.FmatStr(strCTIT);
strCIFG = objDrFn.FmatStr(strCIFG);
strCITX = objDrFn.FmatStr(strCITX);
#endregion //变量处理
#region 变量验证
#region 非空验证
//主键的非空验证
if (strCTOW == "")
{
lblWarning.Text = "新闻标题 不允许为空!";
return;
}
#endregion //非空验证
#region 整型验证
//if (!objDsFt.CheckInt(变量名))
//{
// lblWarning.Text = "变量名 必须是整型数据";
// return;
//}
#endregion //整型验证
#region 浮点验证
//if (!objDsFt.CheckDeciaml(变量名))
//{
// lblWarning.Text = "变量名 必须是数值型数据";
// return;
//}
#endregion //浮点验证
#region 逻辑验证
//string strFileAllPath = fileUplod.PostedFile.FileName.ToString().Trim();
//if (strFileAllPath != "")
//{
// string strSavePath = DsCg.GetUploadPath(Page) + "CPTP\\";
// string strFileName = strURID;// objDsnf.GetFileName(strFileAllPath);
// string strFileExName = objDsFt.GetFileExName(strFileAllPath).ToUpper();
// if ((strFileExName != "JPG") && (strFileExName != "PNG"))
// {
// ClientScript.RegisterStartupScript(typeof(string), "alert", "");
// return;
// }
// string strTime = DateTime.Now.ToString("yyyyMMddHHmmss");
// string strFileNewName = strSavePath + strFileName + "" + strTime + "." + strFileExName;
// fileUplod.PostedFile.SaveAs(strFileNewName);
// strURPC = "../../LJSC/CPTP/" + strFileName + "" + strTime + "." + strFileExName;
//}
//if (string.IsNullOrEmpty(strURPC))
//{
// strURPC = "../../LJTP/default.jpg";
//}
#endregion //逻辑验证
#region 主键验证
#endregion //主键验证
#endregion //变量验证
#region 变量组合
aryInsertFiled.Add("SYID");
aryInsertFiled.Add("CTID");
aryInsertFiled.Add("CTNA");
aryInsertFiled.Add("CTFG");
aryInsertFiled.Add("CTTY");
aryInsertFiled.Add("CTY1");
aryInsertFiled.Add("CTY2");
aryInsertFiled.Add("CTDT");
aryInsertFiled.Add("PBTM");
aryInsertFiled.Add("CTOW");
aryInsertFiled.Add("ATFG");
aryInsertValues.Add(strSYID);
aryInsertValues.Add(strCTID);
aryInsertValues.Add(strCTNA);
aryInsertValues.Add(strCTFG);
aryInsertValues.Add(strCTTY);
aryInsertValues.Add(strCTY1);
aryInsertValues.Add(strCTY2);
aryInsertValues.Add(strCTDT);
aryInsertValues.Add(strPBTM);
aryInsertValues.Add(strCTOW);
aryInsertValues.Add(strATFG);
aryInsertFiledhd.Add("SYID");
aryInsertFiledhd.Add("CTID");
aryInsertFiledhd.Add("CTIT");
aryInsertFiledhd.Add("CIFG");
aryInsertFiledhd.Add("CITX");
aryInsertValueshd.Add(strSYID);
aryInsertValueshd.Add(strCTID);
aryInsertValueshd.Add(strCTIT);
aryInsertValueshd.Add(strCIFG);
aryInsertValueshd.Add(strCITX);
#endregion //变量组合
#region 执行保存
bool bolIfOk = objDrFn.InsertRecode(strTableName, aryInsertFiled, aryInsertValues);
bool bolIfOkhd = objDrFn.InsertRecode(strTableNamehd, aryInsertFiledhd, aryInsertValueshd);
#endregion //执行保存
#region 判断结果
if (!(bolIfOk))
{
lblWarning.Text = "数据保存失败!";
return;
}
#endregion //判断结果
#region 显示结果
//设置保存成功的数据
lblWarning.Text = "数据信息保存成功!";
//PgFnInitial();
objDrFn.UpdateMaxFlowNo("FRPL", "XWGL", "XWID");
//DataTable dt = objDrFn.GetDataTable("SELECT * FROM OC11HN WHERE CTID='" + strCTID + "'");
//gvMain.DataSource = dt;
//gvMain.DataBind();
#endregion //显示结果
}
#endregion //保存按钮事件
#region 重设按钮事件
else if (strCMNA == "Reset")
{
PgFnInitial();
}
#endregion //重设按钮事件
}
#endregion //3.1 按钮事件
#region 4. 页面函数
#region 4.1 控件数据设置
///
/// 控件数据设置
///
private void PgFnInitial()
{
#region 验证用户权限
//PgFnValUserAur();
#endregion //验证用户权限
#region Set Nomal Component
//gvMain.DataSource = null;
//gvMain.DataBind();
#endregion //Set Nomal Component
//初始化页面控件
//初始化页面控件
txtCTOW.Text = "";
//txtCITX.Text = "";
objDrFn.SetDdl(ddlCTY2, "FRPL", "XWTP", "CLNA", "CLTX");
}
#endregion //4.1 控件数据设置
页面效果如图所示: