easyui中弹框中使用百度编辑器不出来

轮回无底线 2015-07-16 04:27:33

<base href="<%=basePath%>">
<!-- 配置文件 百度编辑器-->
<script type="text/javascript"src="<%=basePath%>/ueditor/ueditor.config.js"></script>
<!-- 百度编辑器源码文件 -->
<script type="text/javascript"src="<%=basePath%>/ueditor/ueditor.all.js"></script>

<script type="text/javascript">
var type;

$(function() {
doc=window.parent;
//所属机构
$('#org').combotree({
width : 120,
panelHeight : 'auto',
url : 'xxnr!xxflList.action?comm=0',
});

$('#codetype_table').tree({
checkbox : false,
url : 'xxnr!xxflList.action',
animate : true,
lines : true,
onClick : function(node) {
//显示该类别对应的所有代码,判断是否可维护
$('#code_table').datagrid('load', {
xxflid : node.id
});
//左边菜单选中的节点机构
checkNode = node.id;
},
onSelect : function(node) {
$('#org').combotree('setValue', node.id);

}
});
//去除表格的横向滚动
$("#west").find(".datagrid-body").css("overflow-x","hidden");
//手动设置west表load-msg的显示位置
$("#west").find(".datagrid-mask-msg").css("left",30);

$('#code_table').datagrid({
width : $("#mainPanle").width(),
height : $("#mainPanle").height(),
url : 'xxnr!xxflDataList.action?type=0',
fit:true,
fitColumns:true,
idField : '',
singleSelect : true,
loadMsg : '正在加载...',
nowrap : true,
rownumbers:true,
columns : [ [
{ field : 'contentid',title:'信息内容ID', width : 110, align : 'left',hidden:true },
{ field : 'title',title : '标题',width : 150},
{ field : 'content',title : '内容',width : 150},
{ field : 'xxzt',title:'信息状态', width : 100, align : 'left',formatter:function(value,row,index){
if(value=="1"){
return "可用";
}else if(value=="0"){
return "失效";
}}},
{ field : 'cjr',title : '创建人',width : 100,align : 'right'},
{ field : 'cjrq',title : '创建时间',width : 100,align : 'right'},
{ field : 'zjxgr',title : '最近修改人',width : 100,align : 'right'},
{ field : 'zjxgrq',title : '最近修改时间',width : 100,align : 'right'},
{ field : 'fwcs',title : '访问次数',width : 110,align : 'right'},
] ],
toolbar : '#gs_tb',
pagination : true,
pageSize : 10,
onBeforeLoad : function() {
//加载前设置每列的title居中
$('.datagrid-header .datagrid-cell').css(
'text-align', 'center');
},
onLoadSuccess : function() {
$('#code_table').datagrid("selectRow", 0);
}
});
});
//点击新增弹出对话框
function add(){
openDialog('codeDialog','新增内容');

//填充对话框中的所有combobox的数据
fillCombData();
//为弹出框的'新增' ,'修改','删除'绑定click事件
bindClick();
//验证
//bindfocus();
//左边菜单选中的节点机构
var checkOrg = $('#codetype_table').tree("getSelected");
if(checkOrg){
doc.$('#xxflid').combotree('setValue',checkOrg.id);
}
}
//填充对话框中的所有combobox的数据
function fillCombData(){
//绑定类型下拉列表改变事件
doc.$('#xxlx').combobox({
onSelect: function(){
var t = doc.$('#xxlx').combobox('getValue');
if(t==1){//文章
doc.$('#tr1').show();
doc.$('#tr3').hide();
doc.$('#tr2').hide();
}
else if(t==2){//图片
doc.$('#tr1').hide();
doc.$('#tr2').show();
doc.$('#tr3').hide();
}else{//视频
doc.$('#tr1').hide();
doc.$('#tr2').hide();
doc.$('#tr3').show();
}
},
editable:false
});
doc.$('#cjrq').datetimebox({
required: true,
showSeconds: false,
editable:false
});
doc.$('#fbksrq').datetimebox({
required: true,
showSeconds: false,
editable:false
});
doc.$('#fbjzrq').datetimebox({
required: true,
showSeconds: false,
editable:false
});
var xxflid=doc.$('#xxflid');
xxflid.combotree({
width : 140,
panelHeight : 'auto',
url : 'xxnr!xxflList.action?comm=0',
required : true,
lines : true,
onSelect : function(node) {
// 判断是否是叶子节点
var isLeaf = $(this).tree('isLeaf', node.target);
if (!isLeaf) {
doc.$('#xxflid').combotree('setValue', '');
$.messager.show({
msg : '请选择叶子节点!'
});
//显示隐藏的编辑器
//$('#tr1').hide();
}
}
});
doc.$('#title').validatebox({
required : true,
validType : 'length[2,50]',
missingMessage : '请输入信息标题',
invalidMessage : '信息标题在2-50 位'
});

}
//为弹出框的'新增' ,'修改','删除'绑定click事件
function bindClick(){
doc.$("#btnadd_code").unbind().bind('click',function(){
saveandAdd();
});
doc.$("#btnsave_code").unbind().bind('click',function(){
addorUpdateCode();
});
doc.$("#btnCancel_code").unbind().bind('click',function(){
closeDialog();
});
doc.$('.panel-tool-close').unbind().bind('click',function(){
closeDialog();
});
}

//点击对话框中‘取消按钮’的方法
function closeDialog(){
doc.closePopup_div('codeDialog');
//关闭对话框之后将对话框居中 主要是由于新增和修改是用的同一对话框 防止在父页面由于拖动后显示不居中
center();

}
//设置弹出窗口居中
function center(){
var dialog=doc.$('#codeDialog').closest('.window');
var left=(doc.$("body").width()-dialog.width())/2;
var top=(doc.$("body").height()-dialog.height())/2;
dialog.css({
left:left,
top:top
});
}
//监听窗口大小变化
window.onresize = function(){
setTimeout(domresize,300);
};
//改变表格宽高
function domresize(){
$('#codetype_table').datagrid('resize',{
width : 600,
height : $("#west").height() - $("#lbxq").height() - 13
});
}
//点击”重置“时执行的方法
function resetCondition() {
$('#name').val("");
$('#org').combotree('setValue', '');
var node = $("#codetype_table").tree("getSelected");
if (node != null) {
$("#codetype_table").tree("reload");
}
checkNode = "";
}
//点击搜索条件中”查询“时执行的方法
function checkGS() {
$("#code_table").datagrid('load', {
xxflid : $('#org').combotree('getValue'),
name : $("#name").val(),
});

}
</script>

</head>
<body class="easyui-layout" style="overflow: hidden;">
<div region="west" split="false" style="width: 223px; padding:3px ;border:1px solid #ffffff;" id="west">
<div style="border:1px solid #99BBE8;height:100%;">
<span class="leftTitles">内容结构</span>
<ul id="codetype_table" ></ul>
</div>
</div>
<div id="mainPanle" region="center" style=" padding:3px 3px 3px 0px; border:0px;">
<div id="search_area" >
<div id="conditon" style="width:100%; ">
<table cellpadding="0">
<tr>
<td>所属类别:</td>
<td style="padding-right:10px"><input type="text" id="org" style="vertical-align:middle;" /></td>
<td>名称:</td>
<td style="padding-right:10px"><input type="text" id="name" style="vertical-align:middle;" /></td>
<td><a href="javascript:void(0)" class="easyui-linkbutton my-search-button" iconCls="icon-search" plain="true" onclick="checkGS()">查询</a> </td>
<td><a href="javascript:void(0)" class="easyui-linkbutton my-search-button" iconCls="icon-reset" plain="true" onclick="resetCondition()">重置</a> </td>
</tr>
</table>
</div>
</div>
<table id="code_table"></table>
<div id="gs_tb" style="height:30px;" >
<tb:getToolbar sjflid='<%=request.getParameter("gnid") %>' type="27"/>
</div>
</div>

<!-- 新增 修改 弹出对话框 -->
<div id="codeDialog" class="easyui-window" closed="true" style="width:600px; height: 500px;background: #ffffff;align:center;">
<div >

<form id="code_form" method="post" >
<!-- -token标签- -->
<table border="0" align=center cellpadding="3" cellspacing="0" id="add_code">
<tr>
<td align="right">信息标题:</td>
<td><input id="title" name="title" style="width: 140px;" /></td>
<td align="right">信息类别:</td>
<td><input id="xxflid" name="xxflid"/>
</td>
</tr>
<tr>
<td align="right">信息类型:</td>
<td>
<select id="xxlx" name="xxlx" style="width:145px;">
<option value="1">文章</option>
<option value="2">图片</option>
<option value="3">视频</option>
<option value="4">下载</option>
</select>
</td>
<td align="right">创建时间:</td>
<td>
<input id="cjrq" type="text" name="birthday" style="width: 140px;"></input>
</td>
</tr>
<tr>
<td align="right">发布开始日期:</td>
<td>
<input id="fbksrq" type="text" name="birthday" style="width: 145px;"></input>
</td>
<td align="right">发布截止日期:</td>
<td>
<input id="fbjzrq" type="text" name="birthday" style="width: 140px;"></input>
</td>
</tr>
<tr id="tr1" >
<td colspan="4" align="center">信息内容:
<script type="text/plain" id="myEditor"
name="content"></script> <script type="text/javascript">
UE.getEditor('myEditor',
{
initialFrameWidth : 500,
initialFrameHeight : 250,
toolbars : [ [ 'source', 'bold',
'italic', 'underline',
'fontborder', 'strikethrough',
'removeformat', 'formatmatch',
'pasteplain', '|', 'forecolor',
'backcolor',
'insertorderedlist',
'insertunorderedlist',
'selectall', 'cleardoc', '|',
'touppercase', 'tolowercase',
'|', 'emotion', 'scrawl',
'date', 'time', 'spechars', ] ]
});
</script>
</td>
</tr>
<tr id="tr2" style="display: none;">
<td colspan="4" align="center">图片上传:
<input type="file"/>
</td>
</tr>
<tr id="tr3" style="display: none;">
<td colspan="4" align="center">视频上传:
<input type="file"/>
</td>
</tr>
</table>
</form>
</div>
<div class="windowButton">
<a href="javascript:void(0)" id="btnadd_code" plain="true" class="easyui-linkbutton my-dialog-button" icon="icon-ok" > 保存新增</a>
<a href="javascript:void(0)" id="btnsave_code" plain="true" class="easyui-linkbutton my-dialog-button" icon="icon-save" > 保存修改</a>
<a href="javascript:void(0)" id="btnCancel_code" plain="true" class="easyui-linkbutton my-dialog-button" icon="icon-cancel" >取消</a>
</div>
</div>
</body>
</html>
...全文
177 1 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
灭离 2015-08-31
  • 打赏
  • 举报
回复
引入以下文件
<script type="text/javascript" charset="utf-8" src="<%=basePath %>/js/baidu/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="<%=basePath %>/js/baidu/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="<%=basePath %>/js/baidu/lang/zh-cn/zh-cn.js"></script>

添加网页
<script id="editor" type="text/plain" style="width:100%;height:200px;"></script>在表格中

添加js
<script type="text/javascript">
var ue = UE.getEditor('editor');
</script>
就出来了,但是我出现了一个问题,就是关闭窗口再打开就不见了,对象是有的。。。
(题外话:从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取最新的EasyUI资源 专题页地址如下http:http://download.csdn.net/album/detail/343 同时也希望转载的那些朋友能保留我资源的说明及出处地址 我花那么多精力制作出来的 你们鼠标点两下就给我转走了还不注明出处 实在是不厚道 本来就是本着分享精神的 为的就是聚集一点人气和提供一个优良的环境来一起学习进步的 请不要抹杀掉我的热情 谢谢 )   时隔4个月之久 EasyUI终于迎来大版本更新了 本次更新内容诸多 除了常规维护外 还新增了3个新组件 都很实用 详细的可以阅读更新说明 里面给了详细的解读 另外 从该版本开始我将会逐步的将EasyUI官方以及第三方较好的插件API整合到API文档当 并且会对这些插件做一些简单的Demo实现 存放到配套提供的程序包demo文件夹下 以便大家学习和使用 本期文档将官方提供的所有附加插件的API都整理并存放到Extension节点下了 这些扩展的demo在附带的程序包已经提供 可以用于参考使用 jQuery EasyUI 1 4版本更新内容: Bug(修复) menu:修复在删除一个菜单项的时候该菜单无法正确自适应高度的问题; datagrid:修复在datagrid宽度太小的时候“fitColumns”方法无法正常工作的问题 Improvement(改进) EasyUI的所有组件已经支持非固定 百分比大小的尺寸设置; menu:添加“showItem” “hideItem”和“resize”方法; menu:基于窗体大小自动调整高度; menu:添加“duration”属性 该属性允许用户自定义隐藏菜单动画的持续时间 以毫秒为单位; validatebox:添加“onBeforeValidate”和“onValidate”事件; combo:从该版本开始combo组件扩展自textbox组件(textbox是1 4新增的组件); combo:添加“panelMinWidth” “panelMaxWidth” “panelMinHeight”和“panelMaxHeight”属性; searchbox:从该版本开始searchbox组件扩展自textbox组件(textbox是1 4新增的组件); tree:添加“getRoot”方法 用于返回通过“nodeEl”参数指定的节点的顶部父节点元素 注意:官网的英文API该函数的说明有误 其说明是none 无参数 实际这里是需要参数的 ; tree:添加“queryParams”属性; datetimebox:添加“spinnerWidth”属性; panel:添加“doLayout”方法 用于控制面板内组件的大小; panel:添加“clear”方法 用于清除面板内的内容; datagrid:允许用户设置百分比宽度的列(该功能真是千呼万唤始出来啊 ); form:添加“ajax” “novalidate”和“queryParams”属性; linkbutton:添加“resize”方法 New Plugin(新组件) textbox:该组件是一个增强的输入字段 它可以让用户非常简单的构建一个表单; datetimespinner:该组件是一个日期和时间的微调组件 它允许我们选择一个特定的日期或时间; filebox:filebox 该组件表单元素用于上传文件的文件框工具组件 ">(题外话:从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取

81,117

社区成员

发帖
与我相关
我的任务
社区描述
Java Web 开发
社区管理员
  • Web 开发社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧