Вызов нескольких модальных всплывающих окон из webform в asp.net и C#

Я пытаюсь вызывать несколько модальных всплывающих окон из одной и той же веб-формы, но я не хочу писать их все в одном файле aspx, поэтому я подумал об использовании мастер-страницы.Вызов нескольких модальных всплывающих окон из webform в 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>

Но это не работает. Тем не менее, я думаю, что если я использую masterpage, он перенаправит страницу, чтобы открыть модальное всплывающее окно, поэтому мне интересно, есть ли способ открыть несколько модальных всплывающих окон, не перенаправляя страницу (так что, возможно, мне не следует использовать materpage , но вместо этого функция aC#).

источник

2016-06-19 DavidM

MasterPages являются для сервировки (тема/меню/навигационные панели и т. д.). Либо вы пишете все эти модальные html на странице, чтобы загрузить всплывающее окно, основанное на некоторых критериях из jQuery/javascript, если их не слишком много, или использовать какой-то асинхронный способ, например jQuery, для вызова службы на стороне сервера и динамического преобразования модального html. –

Ваша модальная всплывающая логика должна быть обернута вокруг родителя <div>, который имеет следующие правила стиля: class="modal fade".

В примере ниже у меня есть два разных модальных всплывающие окна, определенные в главной странице, то все, что я должен сделать, чтобы вызывать их из страницы ребенка является вызов $('#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

Вызов нескольких модальных всплывающих окон из webform в asp.net и C#

ответ

Смежные вопросы