2016-10-26 24 views
0

私は、モーダルモーダル構造全体(ヘッダー、ボディーおよびフッター)を含むJSPページを持っています。 ページ別のJSPページから1つのJSPページにブートストラップ・モーダル・ストアをコールする方法は?

<% @ page language = "java" contentType = "text/html; charset=ISO-8859-1" 
pageEncoding = "ISO-8859-1" 
%> 
<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Bootstrap Example</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    </head> 
    <body> 

     <!-- Modal --> 
     <div class="modal fade" id="myModal" role="dialog"> 
      <div class="modal-dialog"> 

       <!-- Modal content--> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal">&times;</button> 
         <h4 class="modal-title">Modal Header</h4> 
        </div> 
        <div class="modal-body"> 
         <p>Some text in the modal.</p> 
        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        </div> 
       </div> 

      </div> 
     </div> 

    </body> 
</html> 

以下のようなもので、私もボタンオープンモーダルをクリックの上、上記のJSPページでID myModal店とのモーダルがopen.The現在になり、別のJSPページを持っていますページはそのまま残り、モーダルポップアップが開きます。ここ は私がこれを取得する方法モーダル

<% @ page language = "java" contentType = "text/html; charset=ISO-8859-1" 
pageEncoding = "ISO-8859-1" 
%> 
<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Bootstrap Example</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    </head> 
    <body> 
     <div class="container"> 
      <h2>Modal Example</h2> 
      <!-- Trigger the modal with a button --> 
      <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> 
     </div> 
    </body> 
</html> 

を呼ぶよどこからページですか?

答えて

0

モーダルのHTMLがページに表示されない場合は、ajaxなしではできません。あなたはモーダルのHTMLコードだけを取得し、現在のボディのどこかに(おそらくjqueryのappendを使用して)配置するajax関数を作成し、それを表示する必要があります。

0

最初にあなたのmoalコードはである必要があります。 divやstuffの場合は、コード内に他のHTMLドキュメントを含めたくない場合があります。

あなたがいずれかのインポートを経由して、そのファイルを含めるか、JSで、その後、上のモーダルを使用したいページの範囲に含まれると思いますが、$("#myModal").modal('show')

を行います
関連する問題