asp.netとc＃

のwebformから複数のモーダルポップアップを呼び出す同じWebフォームから複数のモーダルポップアップを呼び出そうとしていますが、それらを同じaspxファイルに書きたくないので、私は思ったのですマスターページの使用についてasp.netとc＃

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Trabajadores.master.cs" Inherits="Trabajadores" %> 


    <!-- Modal --> 
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <asp:ContentPlaceHolder ID="Modal" runat="server"> 
       </asp:ContentPlaceHolder> 
      </div> 
     </div> 
    </div> 
    <!-- Modal --> 


       <ul class="nav nav-pills nav-stacked small"> 
        <li><a href="~/Empresas/Trabajadores/Ventanas/Empresas.aspx" data-toggle="modal" data-target="#myModal">Empresas</a></li> 
        <li><a href="~/Empresas/Trabajadores/Ventanas/Obras.aspx" data-toggle="modal" data-target="#myModal">Obras</a></li> 
        <li><a href="~/Empresas/Trabajadores/Ventanas/Haberes.aspx" data-toggle="modal" data-target="#myModal">Haberes</a></li> 
        <li><a href="~/Empresas/Trabajadores/Ventanas/Descuentos.aspx" data-toggle="modal" data-target="#myModal">Descuentos</a></li> 
       </ul>

そして、これは、モーダルポップアップのいずれかです：

これは、これまでのコードの一部です

<%@ Page Title="Haberes" Language="C#" MasterPageFile="~/Trabajadores.Master" AutoEventWireup="true" CodeFile="Haberes.aspx.cs" Inherits="Empresas_Trabajadores_Ventanas_Haberes" %> 

<asp:Content ID="BodyContent" ContentPlaceHolderID="Modal" runat="server"> 

       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title" id="myModalLabel">Login</h4> 
       </div> 
       <div class="modal-body"> 
        <form> 
        <div class="form-group"> 
         <label>Email address</label> 
         <input type="email" class="form-control" placeholder="Enter Email"> 
        </div> 
        <div class="form-group"> 
         <label>Password</label> 
         <input type="password" class="form-control" placeholder="Enter Password"> 
        </div> 
        </form> 
       </div> 
       <div class="modal-footer"> 
        <button type="submit" class="btn btn-default">Submit</button> 
       </div> 

</asp:Content>

しかし、それは働いていません。しかし、私はマスターページを使うとモーダルポップアップを開くためにページをリダイレクトすると思いますので、ページをリダイレクトせずに複数のモーダルポップアップを開く方法があるのだろうかと思います（おそらく私はmaterpage 、代わりにac＃関数）。

出典

2016-06-19 DavidM

MasterPagesあるレイアウト（テーマ/メニュー/ナビゲーションペインなど）共有。いずれかのjQuery/javascriptのいくつかの基準に基づいてポップアップにロードするために、それらのモーダルhtmlをページに書き込むか、あまりにも多くない場合はjQueryのような非同期的な方法を使用して、サーバー側のサービスを呼び出してモーダルhtmlを動的に取得します。 –

あなたのモーダルポップアップロジックは、次のスタイルルールclass="modal fade"を持つ親<div>にラップする必要があります。私は、マスターページで定義された2つの異なるモーダルポップアップを持っている以下の例では

はその後、私は子ページからそれらを呼び出すためにしなければならないすべては、コール $('#modalPopupID').modal('show');ある

マスターページ：

%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="jqgrid_example.SiteMaster" %> 

<!DOCTYPE html> 
<html lang="en"> 
<head runat="server"> 
    <meta charset="utf-8" /> 
    <title><%: Page.Title %> - My ASP.NET Application</title> 
    <asp:ContentPlaceHolder runat="server" ID="HeadContent" /> 
</head> 
<body> 
    <form runat="server"> 
     <div id="body"> 
      <asp:ContentPlaceHolder runat="server" ID="FeaturedContent" /> 
      <asp:ContentPlaceHolder runat="server" ID="MainContent" /> 
     </div> 
    </form> 
    <div class="modal fade" tabindex="-1" role="dialog" id="modal1"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title">Modal 1</h4> 
       </div> 
       <div class="modal-body"> 
        <form> 
         <div class="form-group"> 
          <label>Email address</label> 
          <input type="email" class="form-control" placeholder="Enter Email"> 
         </div> 
         <div class="form-group"> 
          <label>Password</label> 
          <input type="password" class="form-control" placeholder="Enter Password"> 
         </div> 
        </form> 
       </div> 
       <div class="modal-footer"> 
        <button type="submit" class="btn btn-default">Submit</button> 
       </div> 
      </div> 
     </div> 
    </div> 
     <div class="modal fade" tabindex="-1" role="dialog" id="modal2"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title">Modal 2</h4> 
       </div> 
       <div class="modal-body"> 
        <form> 
         <div class="form-group"> 
          <label>Email address</label> 
          <input type="email" class="form-control" placeholder="Enter Email"> 
         </div> 
         <div class="form-group"> 
          <label>Password</label> 
          <input type="password" class="form-control" placeholder="Enter Password"> 
         </div> 
        </form> 
       </div> 
       <div class="modal-footer"> 
        <button type="submit" class="btn btn-default">Submit</button> 
       </div> 
      </div> 
     </div> 
    </div> 
</body> 
</html>

子ページ：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ModalPopupExample.aspx.cs" Inherits="jqgrid_example.ModalPopupExample" MasterPageFile="~/Site.Master" %> 


<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> 
    <script type="text/javascript"> 
     $(function() { 
     $('#modal1').modal('show'); 
     //Or uncomment the line below to show the other modal popup 
     //$('#modal2').modal('show'); 
     }); 
    </script> 
</asp:Content> 

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> 
</asp:Content>

出典

2016-06-19 06:51:57

答えて

関連する問題