2016-10-05 12 views
0

私はダイアログポップアップフォームを作るためにnetからコードをコピーしています。 コードは次のとおりです。jQueryがYiiで実行されていません2

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Dialog functionality</title> 
    <link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <!-- CSS --> 
    <style> 
     .ui-widget-header,.ui-state-default, ui-button{ 
      background:#b9cd6d; 
      border: 1px solid #b9cd6d; 
      color: #FFFFFF; 
      font-weight: bold; 
     } 
    </style> 
    <!-- Javascript --> 
    <script> 
     $(function() { 
      $("#dialog-1").dialog({ 
       autoOpen: false, 
      }); 
      $("#opener").click(function() { 
       $("#dialog-1").dialog("open"); 
      }); 
     }); 
    </script> 
</head> 
<body> 
<!-- HTML --> 
<div id="dialog-1" title="Dialog Title goes here...">This my first jQuery UI Dialog!</div> 
<button id="opener">Open Dialog</button> 
</body> 
</html> 

私はYiiの2のビューを作成し、そこにこのコードをコピーしますが、出力が実行されていない、出力ボタンは、通常のボタンとparagrafなどのparagrafだけで、何のpopuoとダイアログはありません!! 1 どうすればいいですか?

+1

のようなツリーを持っているあなたはどのコンソールエラーがないことを確認してください – madalinivascu

+0

@madalinivascu私はコードを変更していない、私はちょうどCrt C + Crt V :)))コードはチュートリアルサイトで私は読んでうまく動作していた。 – ali

+0

他の部分はレイアウトセクションから来るので、ビューファイルにBODY部分だけを追加しようとすることができます。 jsとcssが含まれています。これは、ダイアログが動作しているかどうかをテストしたい場合は、ビューファイルのコードに記述されています。 –

答えて

0

あなたは

はあなたがビューに完全quellcodeをコピーしましたアプリ/ビュー/レイアウトでレイアウトを見つける ビューはレイアウト内部でレンダリングされますか?おそらくいくつかのJavaScriptの読み込みタグは、あなたのレイアウトであるよりも、あまりにも

<link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet"> 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <!-- CSS --> 
    <style> 
     .ui-widget-header,.ui-state-default, ui-button{ 
      background:#b9cd6d; 
      border: 1px solid #b9cd6d; 
      color: #FFFFFF; 
      font-weight: bold; 
     } 
    </style> 
    <!-- Javascript --> 
    <script> 
     $(function() { 
      $("#dialog-1").dialog({ 
       autoOpen: false, 
      }); 
      $("#opener").click(function() { 
       $("#dialog-1").dialog("open"); 
      }); 
     }); 
    </script> 

場合、レイアウト

にこの部分を置くために、この

試みをチェックするには、ブラウザのquellcodeを見て、あなたの意見にこの部分

<!-- HTML --> 
<div id="dialog-1" title="Dialog Title goes here...">This my first jQuery UI Dialog!</div> 
<button id="opener">Open Dialog</button> 

もしあなたがchro私やFirefoxブラウザのプレスコントロール+シフト+ iとquellcode を確認し、これはまだ正しいHTML

または多分ある場合は、この

<html> 
<head> 
...... 
</head> 

<body> 


    <html> 
    <head> 
    ...... 
    </head> 

    <body> 
    ...... 
    </body> 

    </html> 


</body> 

</html> 
+0

私のレイアウトにはいくつかのjsローディングタグがあると思いますが、それは問題ですか?その後、私はyii 2からdefualt jsを無効にしたり削除したりしますか? @ThomasRohde – ali

+0

これは動作しない場合よりも必要な変更を加えてサンプルソースを試してみると便利です。あなたのレイアウトに例のjavascriptの読み込みを追加し、例ではheaderとbodyタグを削除します。 –

+0

私はごめんなさい!あなたがこのコードを空のhtmlファイルにコピーすることを意味したら、私はもう一度やってしまい、うまく走った! @ThomasRohde – ali

関連する問題