2016-12-08 5 views
0

私は、モーダル自体を終了することなく、ブートストラップモーダルの中で開きたいIndex.Htmlファイルを持っています。基本的に内部リンクとして機能します。私はASP.net MVCを使用してこれをしようとしています。この場所は、Captivateの9から生成されている、と私はモーダルhrefが外部ページにリダイレクトされないようにする方法。

のJavascriptにサンプルとして単一のスライドを追加しようとしています:

var modal3 = document.getElementById('myModal3'); 
var img3 = document.getElementById('myImg3'); 
var modalImg3 = document.getElementById("img03"); 
img3.onclick = function() { 
    modal3.style.display = "block"; 

} 

var span = document.getElementsByClassName("close")[2]; 
span.onclick = function() { 
    modal3.style.display = "none"; 
} 

モーダル:私はことを書いた

<div id="myModal3" class="modal"> 
    <span class="close" style="color:white">×</span> 
</div> 

答えて

1

何かこれはAjaxを使用しているのと似ています。私はあなたがこのルートに行きたいとは確信していませんが、少なくとも試してみる価値があります!追加する必要があるのは、あなたがクリックしているいくつかの要素にbtnCreate IDがあり、それが機能するはずです!

<!-- modal placeholder--> 
<div id='myModal' class='modal fade in'> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div id='myModalContent'></div> 
     </div> 
    </div> 
</div> 

htmlは、ロードするコンテンツのプレースホルダです。

このスクリプトは、ウィンドウを開いてコンテンツを読み込むだけです。コントローラからほぼ傍受しています。これは、このモーダルウィンドウにロードしたいPartialViewです。

$(function() { 
    $.ajaxSetup({ cache: false }); 

    $("body").on("click", "#btnCreate", function (e) { 
     $('#myModalContent').load(this.href, function() { 
      $('#myModal').modal({ 
       backdrop: 'static', 
       keyboard: true 
      }, 'show'); 
      bindForm(this); 
     }); 

     return false; 
    }); 
}); 

次にモーダルウィンドウを閉じる。

function bindForm(dialog) { 
    $('form', dialog).submit(function() { 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      data: $(this).serialize(), 
      success: function (result) { 
       if (result.success) { 
        $('#myModal').modal('hide'); 
       } else { 
        $('#myModal').modal('hide'); 
       } 
      } 
     }); 
     return false; 
    }); 
} 
+0

こんにちは、ありがとうございます。私はあなたの答えに感謝し、私はこの仕事を周りに試してみるが、これは部分的に呼び出されているので、私はアヤックスが可能であることを知らない。 – Joshua

+0

ActionResultをクライアントに返す限り、初期バインディングはそれを取得してモーダルウィンドウに挿入する必要があります。周囲に遊びが必要な場合があります。 – Jared

関連する問題