Yii2、Javascriptはモーダル内でしか動作しません。

私は荒々しいフォームにモーダルブートストラップを使用しています。また、giiジェネレータを1ページ分に拡張するyii2-ajaxcrud拡張も使用しています。Yii2、Javascriptはモーダル内でしか動作しません。

すべてが正しく動作し、モデル、検証などを保存しています...しかし、javascriptプラグインを使用しようとしています：（Leafoのsticky-kit）モーダルで '作成'ビューにアクセスすると、次のエラーが発生します。

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

私はインデックスビューから「作成」ビューにアクセスします。モーダルが開くと、クロムインスペクタにjqueryとスティックプラグインの注入が表示されます。さらに、ajax crud extensionを使用すると、直接URLによって生成されたビューにアクセスすることができ、スティックプラグインが機能します。モーダルでビューにアクセスするだけでエラーが発生します。

何ができますか？以下は私の主な関連コードです。

//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-> bundle = ['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'がそのイベントをトリガします。 –

renderPartialはjqueryライブラリをロードしないため、renderPartialではなくrenderAjaxを使用してください。

出典

2016-10-04 01:53:36

こんにちは、あなたのヒントのために、私はrenderAjaxを使用しています...コードの最後の 'else'は、非Ajaxリクエストです。 – Johny

Yii2、Javascriptはモーダル内でしか動作しません。

答えて

関連する問題