Ecmall 调用自带的所见即所得编辑器
第一步: 在 xx.app.php中调用
//调用编辑器必不可少
$this->import_resource(array('script' => 'jquery.plugins/jquery.validate.js,change_upload.js'));
/* 所见即所得编辑器 */
$template_name = $this->_get_template_name();
$style_name = $this->_get_style_name();
$this->assign('build_editor', $this->_build_editor(array(
'name' => 'content',
'content_css' => SITE_URL . "/themes/mall/{$template_name}/styles/{$style_name}/css/ecmall.css"
))); $this->import_resource(array('script' => 'jquery.plugins/jquery.validate.js,change_upload.js'));
/* 所见即所得编辑器 */
$template_name = $this->_get_template_name();
$style_name = $this->_get_style_name();
$this->assign('build_editor', $this->_build_editor(array(
'name' => 'content',
'content_css' => SITE_URL . "/themes/mall/{$template_name}/styles/{$style_name}/css/ecmall.css"
第二步: 对应的*.html中
{include file="header.html"}
<!--正常显示所见即所得编辑器第二步-->
<script type="text/javascript">
$(function(){
$('#article_form').validate({
errorPlacement: function(error, element){
$(element).next('.field_notice').hide();
$(element).after(error);
},
success : function(label){
label.addClass('right').text('OK!');
},
rules : {
title : {
required : true
},
cate_id :{
required : true
},
link :{
url : true
},
sort_order:{
number : true
}
},
messages : {
title : {
required : '{$lang.title_empty}'
},
cate_id : {
required : '{$lang.cate_empty}'
},
link : {
url : '{$lang.link_limit}'
},
sort_order : {
number : '{$lang.number_only}'
}
}
});
});
function add_uploadedfile(file_data)
{
var newImg = '<tr id="' + file_data.file_id + '" class="tatr2"><input type="hidden" name="file_id[]" value="' + file_data.file_id + '" /><td><img width="40px" height="40px" src="' + SITE_URL + '/' + file_data.file_path + '" /></td><td>' + file_data.file_name + '</td><td><a href="javascript:insert_editor(\'' + file_data.file_name + '\', \'' + file_data.file_path + '\');">{$lang.insert_editor}</a> | <a href="javascript:drop_uploadedfile(' + file_data.file_id + ');">{$lang.drop}</a></td></tr>';
$('#thumbnails').prepend(newImg);
}
function insert_editor(file_name, file_path){
tinyMCE.execCommand('mceInsertContent', false, '<img src="'+ SITE_URL +'/' + file_path + '" alt="'+ file_name + '">');
}
function drop_uploadedfile(file_id)
{
if(!window.confirm(lang.uploadedfile_drop_confirm)){
return;
}
$.getJSON('index.php?app=article&act=drop_uploadedfile&file_id=' + file_id, function(result){
if(result.done){
$('#' + file_id).remove();
}else{
alert('drop_error');
}
});
}
</script>
<!--正常显示所见即所得编辑器第三步-->
{$build_editor}
<!--正常显示所见即所得编辑器第四步-->
<div class="info">
<form method="post" enctype="multipart/form-data" id="article_form">
<table class="infoTable">
<tr>
<th class="paddingT15">
<label for="article">{$lang.desc}:</label></th>
<td class="paddingT15 wordSpacing5">
<textarea id="article" name="content" style="width:650px;height200px;">{$article.content|escape}</textarea>
</td>
</tr>
</table>
</form>
</div>
{include file="footer.html"} <!--正常显示所见即所得编辑器第二步-->
<script type="text/javascript">
$(function(){
$('#article_form').validate({
errorPlacement: function(error, element){
$(element).next('.field_notice').hide();
$(element).after(error);
},
success : function(label){
label.addClass('right').text('OK!');
},
rules : {
title : {
required : true
},
cate_id :{
required : true
},
link :{
url : true
},
sort_order:{
number : true
}
},
messages : {
title : {
required : '{$lang.title_empty}'
},
cate_id : {
required : '{$lang.cate_empty}'
},
link : {
url : '{$lang.link_limit}'
},
sort_order : {
number : '{$lang.number_only}'
}
}
});
});
function add_uploadedfile(file_data)
{
var newImg = '<tr id="' + file_data.file_id + '" class="tatr2"><input type="hidden" name="file_id[]" value="' + file_data.file_id + '" /><td><img width="40px" height="40px" src="' + SITE_URL + '/' + file_data.file_path + '" /></td><td>' + file_data.file_name + '</td><td><a href="javascript:insert_editor(\'' + file_data.file_name + '\', \'' + file_data.file_path + '\');">{$lang.insert_editor}</a> | <a href="javascript:drop_uploadedfile(' + file_data.file_id + ');">{$lang.drop}</a></td></tr>';
$('#thumbnails').prepend(newImg);
}
function insert_editor(file_name, file_path){
tinyMCE.execCommand('mceInsertContent', false, '<img src="'+ SITE_URL +'/' + file_path + '" alt="'+ file_name + '">');
}
function drop_uploadedfile(file_id)
{
if(!window.confirm(lang.uploadedfile_drop_confirm)){
return;
}
$.getJSON('index.php?app=article&act=drop_uploadedfile&file_id=' + file_id, function(result){
if(result.done){
$('#' + file_id).remove();
}else{
alert('drop_error');
}
});
}
</script>
<!--正常显示所见即所得编辑器第三步-->
{$build_editor}
<!--正常显示所见即所得编辑器第四步-->
<div class="info">
<form method="post" enctype="multipart/form-data" id="article_form">
<table class="infoTable">
<tr>
<th class="paddingT15">
<label for="article">{$lang.desc}:</label></th>
<td class="paddingT15 wordSpacing5">
<textarea id="article" name="content" style="width:650px;height200px;">{$article.content|escape}</textarea>
</td>
</tr>
</table>
</form>
</div>
备注:<!--正常显示所见即所得编辑器第二步-->是多余的可以不要