2016-10-03 5 views
0

내 crud 양식에 모달 부트 스트랩을 사용하고 있으며, 하나의 페이지를 만들기 위해 gii 생성기를 확장하는 yii2-ajaxcrud 확장자도 사용하고 있습니다.Yii2, Javascript는 모달 내부에서만 작동하지 않습니다.

모든 것이 올바르게 작동하고 모델, 유효성 검사 등을 저장합니다. 그러나 javacript 플러그인을 사용하려고합니다. (Leafo의 스티커 키트) 맨 위에 내 작업 버튼을 붙여야합니다. 내가 모달 내 '생성'보기에 액세스 할 때 다음과 같은 오류가 발생하는 일이 : 인덱스보기에서

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

내가 '생성'보기에 액세스 할 수 있습니다. 모달이 열리면 크롬 검사기에서 jquery와 스틱 플러그인을 볼 수 있습니다. 또한, ajax crud 확장으로 직접 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-> 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> 
+0

주문 문제가있는 것 같습니다. 두 스크립트 모두에 대한 위치 등록을 시도 했습니까? 또는 적어도 $ this-> registerJs ("$."panel-heading '). stick_in_parent(); ", View :: POS_END);'(http://www.yiiframework.com/doc -2.0/yii-web-view.html # registerJs() - detail) –

+0

안녕하세요, 팁 주셔서 감사합니다. 순서가 잘 보이고,보기의 순서를 포함하여 질문을 편집했습니다. – Johny

+0

여기서 문제는 lib가로드 된 후 stick_in_parents가 실행된다는 보장을 할 수 없다는 것입니다. 원격으로 제공되기 때문에 더욱 그렇습니다. '.on ('event', ...)'를 사용하고 ajax 호출에서'success'가 그 이벤트를 트리거해야합니다. –

답변

2

renderPartial은 jquery 라이브러리를로드하지 않으므로 renderPartial 대신 renderAjax를 사용해야합니다.

+0

안녕하세요, 귀하의 팁 forsk, 그러나, 나는 renderAjax 사용하고 있습니다 ... 코드에서 마지막 'else'아닌 아약스 요청입니다. – Johny

관련 문제