我正在为CKEditor & Yii 1
开发一个文件管理器插件。我在编辑器工具栏上创建了一个按钮,在单击该按钮时,我打开了一个对话框窗口。为了加载窗口的内容/ html,我正在对我的控制器动作进行ajax调用,即加载视图的filemanager/index
。在该视图中,我有javascript
调用启动文件管理器插件,并使用id="fileview"
将上传目录中的所有文件填充到主div,现在我的问题是javascript
无论我在索引操作中使用renderPartial('viewname',[],false,true)
,都不会执行视图内部的调用。
我的插件适用于tinyMCE
,目前我正在尝试重用文件管理器脚本来处理CKEditor,我的文件管理器脚本位于idows-file-browser.min.js
,我调用idowsFileBrowser.init()
进行初始化它,但在tinyMCE
插件中我使用windowmanager.open()
绝对不是ajax调用感染它打开一个窗口并加载从控制器操作返回的内容。
我正在尝试寻找一种方法,我不需要为现有的插件脚本文件或视图更改任何内容,但似乎CKEditor
我可能需要移动idowsFileBrowser.init()
在收到来自ajax调用的响应后,在idowsfilemanagerdialog.js
文件内调用。
任何人都可以帮助我在不改变流程的情况下使其发挥作用。
idowsfilemanagerdialog.js
CKEDITOR.dialog.add('idowsfilemanagerDialog', function(editor) {
return {
title: 'Tinyii Filemanager By IDOWS',
minWidth: 850,
minHeight: 600,
contents: [{
id: "File list",
elements: [{
type: 'html',
id: 'foo',
html: '<div id="main-container"></div>',
}]
}],
onLoad: function() {
var document = this.getElement().getDocument();
var element = document.getById('main-container');
$.ajax({
url: '/filemanager/index',
method: 'get',
dataType: 'html',
data: {
editor: '_CK'
}
}).done(function(res) {
if (element) {
element.setHtml(res);
}
});
},
};
});
FilemanagerController中的索引操作
/**
* Index main Entry Action for filemanager
* Opens Main modal window for the file manager
*/
public function actionIndex() {
$model = new TinyiiAssetUploadForm();
$uploadDir = str_replace ( "\\" , "/" , Yii::app ()->basePath . '/..' . Yii::app ()->params['UPLOAD_DIR'] );
$uploadDirExists = is_dir ( realpath ( $uploadDir ) );
if ( !$uploadDirExists ) {
throw new Exception ( 'The upload directory you specified in your param file does not exist.' . $uploadDir );
}
$this->renderPartial ( 'dialog' , array( 'model' => $model ) , false , true );
}
查看文件
$cs->registerScriptFile ( Yii::app ()->params['PLUGIN_DIR'.$this->editorType] . '/js/idows-file-browser.min.js' );
$cs->registerScript ( 'loadtree' , 'idowsFileBrowser.init();',CClientScript::POS_LOAD );
?>
<?php echo $this->renderPartial ( 'alerts' ); ?>
<div class="idows-container-body">
<div class="idows-abs-end"></div>
<div class="idows-container idows-first idows-last" >
<div class="idows-container-body " style="width:100%;">
<div class="idows-abs-end"></div>
<div class="idows-container idows-first" style="border-width: 0px 0px 1px; left: 0px; top: 0px; height: 38px;">
<!--UPLOAD PROGRESS INFO BAR-->
<div id="upload_in_progress" class="upload_infobar">
<img src="<?= Yii::app ()->params['PLUGIN_DIR'.$this->editorType] ?>/skin/img/loader.gif" width="16" height="16" class="spinner">
Upload in progress…
<div id="upload_additional_info"></div>
</div>
<div id="upload_infobar" class="upload_infobar"></div>
<!--CONTROLS CONTAINER-->
<div class="idows-container-body idows-menubar idows-panel" style="width: 100%;">
<div class="idows-abs-end"></div>
<?php echo $this->renderPartial ( 'controls' , [ 'model' => $model ] ); ?>
</div>
<!-- FILE BROWSER -->
<div class="idows-container idows-float-panel idows-last" role="group" style="position: relative;">
<div class="idows-thumbnailview" id="file_container">
<div class="idows-container-body idows-flow-layout" id="fileview">
</div>
</div>
</div>
<?= CHtml::hiddenField ( 'current_template' , 'thumbview' , [ 'id' => 'current_template' ] ); ?>
</div>
</div>
</div>
</div>
<!-- IFRAME FOR FILE UPLOAD -->
<iframe id="upload_target" name="upload_target" src="<?= Yii::app ()->getBaseUrl ( true ) ?>/index.php?r=filemanager/blank"></iframe>
<!-- THICK BOX CONTAINER AND MASK -->
<div id="dialog" class="window">
<a href="#." class="close-preview"/>x</a>
</div>
<div id="overlay"></div>
<?=
$this->renderPartial ( 'bootstrap-modals' )?>
答案 0 :(得分:0)
看起来我必须遵循与tinyMCE
相同的模态窗口结构,这意味着创建一个iframe并将其指向动作/filemanager/index
并且所有工作都像魅力,ajax调用不会在视图文件中运行并加载内联javascript的内容,这是我的对话框的代码onLoad
其他任何人都试图这样做。
CKEDITOR.dialog.add('idowsfilemanagerDialog', function(editor) {
return {
title: 'Tinyii Filemanager By IDOWS',
minWidth: 850,
minHeight: 650,
buttons: false,
contents: [{
id: "File list",
elements: [{
type: 'html',
id: 'foo',
html: '<div id="main-container"></div>',
}]
}],
onLoad: function() {
let document = this.getElement().getDocument();
$('<iframe>', {
id: 'file-manager-frame',
src: '/filemanager/index?editor=_CK',
frameborder: 0,
width: this.definition.dialog.definition.minWidth,
height: this.definition.dialog.definition.minHeight,
}).appendTo("#main-container");
},
};
});