Yii2，JavaScript不工作只在模态内

我使用模态bootstrap为我的crud窗体，我也使用yii2-ajaxcrud扩展，它扩展了单个页面crud的gii生成器。Yii2，JavaScript不工作只在模态内

一切都正常工作，保存模型，验证等...但是，我试图使用JavaScript插件:(从Leafo sticky-kit）将我的动作按钮放在顶部。当我访问我的'创建'视图模式时发生以下错误：

"Uncaught TypeError: $ (...) stick_in_parent is not a function."

从索引视图我访问'创建'视图。当模式打开时，我在Chrome检查器中看到jquery和棒插件的注入。而且，通过ajax crud扩展，我还可以访问由直接URL生成的视图，因此stick插件可以工作。只有以模态访问视图才会出现错误。

可能是什么？以下是我的主要相关代码。

//namespace app\modules\crm\controllers 
public function actionCreate() 
    { 
     $request = Yii::$app->request; 
     $model = new Classes(); 

     if($request->isAjax){ 
      /* 
      * Process for ajax request 
      */ 
      Yii::$app->response->format = Response::FORMAT_JSON; 
      if($request->isGet){ 
       return [ 
        'title'=> "Create new Classes", 
        'content'=>$this->renderAjax('create', [ 
         'model' => $model, 
        ]), 
        'footer'=> Html::button('Close',['class'=>'btn btn-default pull-left','data-dismiss'=>"modal"]). 
           Html::button('Save',['class'=>'btn btn-primary','type'=>"submit"]) 

       ];   
      }else if($model->load($request->post()) && $model->save()){ 
       return [ 
        'forceReload'=>$this->htmlTableContainerId , 
        'title'=> "Create new Classes", 
        'content'=>'<span class="text-success">Create Classes success</span>', 
        'footer'=> Html::button('Close',['class'=>'btn btn-default pull-left','data-dismiss'=>"modal"]). 
          Html::a('Create More',['create'],['class'=>'btn btn-primary','role'=>'modal-remote']) 

       ];   
      }else{   
       return [ 
        'title'=> "Create new Classes", 
        'content'=>$this->renderAjax('create', [ 
         'model' => $model, 
        ]), 
        'footer'=> Html::button('Close',['class'=>'btn btn-default pull-left','data-dismiss'=>"modal"]). 
           Html::button('Save',['class'=>'btn btn-primary','type'=>"submit"]) 

       ];   
      } 
     }else{ 
      /* 
      * Process for non-ajax request 
      */ 
      if ($model->load($request->post()) && $model->save()) { 
       return $this->redirect(['view', 'id' => $model->ID]); 
      } else { 
       return $this->render('create', [ 
        'model' => $model, 
       ]); 
      } 
     } 

    }

视图

// create view 
<div class="panel-body" style="height: 600px"> 
    <div class="classes-create"> 
      <?= $this->render('_form', [ 
       'model' => $model, 
      ]) ?> 
    </div> 

</div> 

     $this->registerJsFile('http://leafo.net/sticky-kit/src/sticky-kit.js', ['depends' => [\yii\web\JqueryAsset::className()]]); 

     $this->registerJs("$('.panel-heading').stick_in_parent();");

EDIT

在视图中的实际HTML generetade，当模态是打开的。我尝试删除重复包含的jquery（在模态和索引），我知道了（与Yii :: $ app-> assetManager-> bundles = ['yii \ web \ JqueryAsset'=> false，] ... ）但错误仍然存在，所以我保留它。

<html lang="pt-BR"> 
    <body> 
     // omitted content, body content of index view, with gridview etc. 
     <div id="ajaxCrudModal" class="fade modal in" role="dialog" tabindex="-1" style="display: block;"> 
      <div class="modal-dialog "> 
       <div class="modal-content"> 
        <div class="modal-body"><div class="panel"> 
         <div class="panel-body" style="height: 600px"> 
          // omitted content 
         </div> 
        </div> 
        <script src="/yii2/basic/assets/32e507bc/jquery.js"></script> 
        <script src="/yii2/basic/assets/9f23c46b/yii.js"></script> 
        <script src="/yii2/basic/assets/9f23c46b/yii.validation.js"></script> 
        <script src="/yii2/basic/assets/9f23c46b/yii.activeForm.js"></script> 
        <script src="http://leafo.net/sticky-kit/src/sticky-kit.js"></script> 
        <script type="text/javascript"> 
         //$('body').on('load', function(){ 
         $('.panel-heading').stick_in_parent(); 
         //}); 
        </script> 
        </div> 
        <div class="modal-footer"></div> 
       </div> 
      </div> 
     </div> 

     <script src="/yii2/basic/assets/32e507bc/jquery.js"></script> 
     <script src="/yii2/basic/assets/9f23c46b/yii.js"></script> 
     <script src="/yii2/basic/assets/fb64637f/js/bootstrap.js"></script> 
     <script src="/yii2/basic/assets/9f23c46b/yii.validation.js"></script> 
     <script src="/yii2/basic/assets/9f23c46b/yii.activeForm.js"></script> 
     <script src="/yii2/basic/assets/28255cf7/dist/js/bootstrap-dialog.js"></script> 
     <script src="/yii2/basic/assets/9f23c46b/yii.gridView.js"></script> 
     <script src="/yii2/basic/assets/75fbd502/js/kv-grid-action.js"></script> 
     <script src="/yii2/basic/assets/8d08c7cb/jquery.pjax.js"></script> 
    </body></html>

来源

2016-10-03 Johny

这看起来像您可能有订单问题？你有没有试过注册两个脚本的位置？或者至少使用：'$ this-> registerJs（“$（'。panel-heading'）。stick_in_parent（）;”，View :: POS_END）;'（http://www.yiiframework.com/doc -2.0/yii-web-view.html＃registerJs（） - detail） –

嗨，感谢您的提示，我试过但没有效果。顺序看起来不错，我编辑了包括视图中的顺序在内的问题。 – Johny

我认为这里的问题是你不能在加载lib之后运行stick_in_parents。因为它是远程服务的。你应该使用'.on（'event'，...）'，并在你的ajax调用'success'触发该事件。 –

您应该使用renderAjax而不是renderPartial，因为renderPartial不会加载jQuery库。

来源

2016-10-04 01:53:36

嗨，你的提示thansk，但是，我使用renderAjax ...代码中的最后'其他'是非Ajax请求。 – Johny

Yii2，JavaScript不工作只在模态内

回答

相关问题