【问题标题】：Yii2 Dropzone.js init not workingYii2 Dropzone.js 初始化不工作
【发布时间】：2017-04-14 22:39:38
【问题描述】：

我正在使用 yii2 和 dropzonejs (perminder-klair/yii2-dropzone)

当我想用一些数据初始化视图时，我得到了这个错误，似乎未处理 init 调用

错误

dropzone.min.js:1 Uncaught TypeError: this.options.init.call is not a function
    at c.init (dropzone.min.js:1)
    at new c (dropzone.min.js:1)
    at HTMLDocument.<anonymous> (index.php?r=branches/upload:672)
    at fire (jquery.js:3187)
    at Object.fireWith [as resolveWith] (jquery.js:3317)
    at Function.ready (jquery.js:3536)
    at HTMLDocument.completed (jquery.js:3552)

我的dropzonejs

 <?= \kato\DropZone::widget([
        'autoDiscover' => false,
       'options' => [
         'init' => "function(file){alert( ' is removed')}",
         'url'=> 'index.php?r=branches/upload',
           'maxFilesize' => '2',
           'addRemoveLinks' =>true,
            'acceptedFiles' =>'image/*',    


             ],
       'clientEvents' => [
           'complete' => "function(file){console.log(file)}",
          // 'removedfile' => "function(file){alert(file.name + ' is removed')}"
           'removedfile' => "function(file){
             alert('Delete this file?');
          $.ajax({
               url: 'index.php?r=branches/rmf',
               type: 'GET',
               data: { 'filetodelete': file.name}
          });

           }"
       ],
   ]);
?>

【问题讨论】：

您好可以添加生成的脚本代码

标签： php yii dropzone.js yii2-advanced-app

【解决方案1】：

此插件使用Json::encode 函数进行编码选项，因此，在您的代码中将init 编码为字符串。字符串不是函数。

您可以简单地将JsExpression 用于javascript 函数来防止这种情况发生。

当使用 yii\helpers\Json::encode() 或 yii\helpers\Json::htmlEncode() 编码一个值，JsonExpression 对象将被特殊处理并编码为 JavaScript 表达式 而不是字符串。

这段代码应该可以工作。

<?= \kato\DropZone::widget([
        'autoDiscover' => false,
       'options' => [
         'init' => new JsExpression("function(file){alert( ' is removed')}"),
         'url'=> 'index.php?r=branches/upload',
           'maxFilesize' => '2',
           'addRemoveLinks' =>true,
            'acceptedFiles' =>'image/*',    


             ],
       'clientEvents' => [
           'complete' => "function(file){console.log(file)}",
          // 'removedfile' => "function(file){alert(file.name + ' is removed')}"
           'removedfile' => "function(file){
             alert('Delete this file?');
          $.ajax({
               url: 'index.php?r=branches/rmf',
               type: 'GET',
               data: { 'filetodelete': file.name}
          });

           }"
       ],    ]); ?>

【讨论】：

【解决方案2】：

看起来你选项中的这部分覆盖了 Dropzone.js init 函数：

'init' => "function(file){alert( ' is removed')}",

您使用的 Yii2 插件只是简单地对选项数组进行编码：

Json::encode($this->options)

所以你的 init 不是 function 它是一个 string 像这样：

var options = { "init" : "function(file){alert( ' is removed')}" }

~~无法在此 php 插件上设置 init 选项。~~

编辑：感谢@CooPer 的更正，Yii2 不是我最喜欢的框架，所以我对它不是很熟悉。这是一个很好的解决方案。

【讨论】：