标签: modalpopup

单击图像会显示一个长的滚动模式。问题是，如果您在模式中滚动，也会滚动模式的背面。你如何解决它？

模态是一个组件。这是我的代码：

Carousel.vue

<template>
  <div>
    <div v-for="(item, index) in photos" :key="index">
      <div @click="imgClick(item)" style="cursor:pointer;">
        <img :src="item.thumbnail" />
      </div>
      <Modal v-if='item.show' @close="item.show = false">
        <div slot='body'>
          <img :src="item.thumbnail" :class="`img-index--${index}`"/>
        </div>        
      </Modal>
    </div>
  </div>
</template>

<script>
import Modal from './Modal.vue'
export default {
  props: {
    items: { type: Array, default: () => [] }
  },
  data() {
    return {
      photos: {}
    }
  },
  created() {
    this.photos = this.items.map(item => {
      return { ...item, show: false }
    })
  },
  methods: {
    imgClick(item) { …

我还需要使用“ESC”键关闭模态，此时它正在关闭“CLOSE”和“CONFIRM”按钮。我正在使用 reactstrap，react hooks。键盘 {show} 和 handleClose 它不起作用。

这是代码：

const DeleteUserModal = props => {
    const { user, show } = props;

    const deleteUser = async () => {
        await props.removeUser(user);
        props.onCloseModal();
    };

    const handleKeyPress = target => {
        if (target.charCode === ENTER_KEY) {
            deleteUser();
        }
    };
    


    return (
        <div onKeyPress={handleKeyPress}>
            <Modal isOpen={show} toggle={props.onCloseModal}  >
                
                <ModalHeader toggle={props.onCloseModal}>
                    <IntlMessages id="modal.delete.user.title" />
                </ModalHeader>

                <ModalBody>
                    <IntlMessages id="modal.delete.user.description" />
                </ModalBody>

                <ModalFooter>
                    <Button className="cancel" onClick={props.onCloseModal}>
                        <IntlMessages id="modal.common.cancel" />
                    </Button>
                    <Button className="action" onClick={deleteUser}>
                        <IntlMessages id="modal.common.ok" />
                    </Button> …

我有一个ASP.NET按钮.单击该按钮时,我希望在按钮的服务器端代码运行后显示模式弹出窗口.我不想使用ASP.NET Ajax控件工具包模式弹出扩展器.

使用ASP.NET Ajax,我可以挂钩到结束请求事件.有没有办法在没有ASP.NET Ajax的情况下执行此操作.只是jQuery？在回发后,我基本上想在服务器端点击代码运行后运行一些javascript.

好的,所以我有这个片段 http://jsfiddle.net/8vFEd/ 这里;

每当弹出窗口出现时,我要么禁用后台,以便用户在关闭第一个弹出窗口之前不能点击另一种语言,或者我将如何实现这一点,每当用户点击第二语言时,第一个弹出窗口消失,出现相应的弹出窗口.

我希望我的表单在单击生成按钮时显示一个弹出窗口。当弹出窗口显示时，背景应该会褪色。

下面是包含生成按钮的表单。

<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display: none;">
        <tr><td id="ds_calclass">
            </td></tr>
    </table>
    <form name="cashreciept" method="POST" action="/ColdStorage/cashreciept" id="cashreciept">

        <div id="maindiv" >
            <div align="center">
                <p>&nbsp;</p>
                <p id="Title" align="center">CHANDNA COLD STORAGE
                </p>
            </div><br>
            <p align="center" style="font-size: 21px">CASH RECIEPT</p>
            <fieldset>
                <legend>CASH RECIEPT DETAILS:</legend>
                <table width="823" height="146" border="0" cellpadding="10">
                    <tr>
                        <td width="155">AGREEMENT  NO.: </td>
                        <td width="272" height="56"><input type="text" name="agrno" id="agrno" placeholder="Agreement No" value ="<%=agrno%>" >
                            <input type="button" name="Fill Details" id="fill details" value="FILL DETAILS" width="10px" height="10px" onClick="javascript:submitcash()"></td>


                        <td width="124">RECIEPT NO.:</td>
                        <td width="182" height="56"><input type="text" name="Recieptno" …

我有一个带有 gridview 的模式弹出窗口，这个 gridview 有很多行，我只希望用户能够选择一行。因此，如果他们选择另一个，它将取消选择前一个。

我尝试了多种方法，但无法触发 oncheckedchanged 事件。请有人可以帮助干杯

<asp:button id="btnShowPopupOW" style="display: none" runat="server" />
<asp:modalpopupextender id="mpeOW" behaviorid="mpeOW" runat="server" targetcontrolid="btnShowPopupOW"
    popupcontrolid="pnlpopupOW" cancelcontrolid="imgOWCancel" backgroundcssclass="modalBackground" />
<asp:panel id="pnlpopupOW" runat="server" width="600px" style="display: none;" class="ModalPanel">

            <div style="position: relative; min-height: 490px;">
                <asp:UpdatePanel ID="upExisting" runat="server" ChildrenAsTriggers="true">
                    <ContentTemplate>
                        <table style="width: 600px;">
                            <tr height="25px">
                                <td>
                                    <asp:Panel ID="pnlPrev" runat="server" Height="200px" ScrollBars="Auto" HorizontalAlign="Center">
                                        <asp:GridView ID="grdPrevious" runat="server" ClientIDMode="Static" AutoGenerateColumns="false" Width="100%"
                                            ShowFooter="false" ShowHeaderWhenEmpty="false" DataKeyNames="ID"  >
                                            <Columns>
                                                <asp:BoundField DataField="dates" HeaderText="Dates" />
                                                <asp:BoundField DataField="Prev" HeaderText="Previous" />
                                                <asp:TemplateField>
                                                    <ItemTemplate>
                                                        <asp:CheckBox ID="ChkSelect" runat="server"  OnCheckedChanged="ChkSelect_OnCheckedChanged" />
                                                    </ItemTemplate>
                                                </asp:TemplateField> …

我有一个要求，我需要在模态弹出页面中显示一个列表。我可以显示一个列表，但我不能使背景颜色透明或半透明，以便它下面的页面部分可见。

我正在使用以下方法从我的视图模型推送页面：

NavigationParameters oNavParams = new NavigationParameters();
oNavParams.Add("Mode", "FeedBack");
oNavParams.Add("selectedItem", txtFeedback);
_navigationService.NavigateAsync("PopupBox", oNavParams);

这是我的 xaml 代码：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             xmlns:local="clr-namespace:MyApp"
             prism:ViewModelLocator.AutowireViewModel="True"
             x:Class="MyApp.Views.PopupBox">
    <ContentPage.Content>
        <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <ContentView x:Name="popupListView" BackgroundColor="Transparent" Padding="10, 0" IsVisible="false" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All">
                <StackLayout VerticalOptions="Center" HorizontalOptions="Center">
                    <StackLayout Orientation="Vertical" HeightRequest="200" WidthRequest="300" BackgroundColor="White">
                        <ListView x:Name="sampleList">
                        </ListView>
                    </StackLayout>
                </StackLayout>
            </ContentView>
        </AbsoluteLayout>
    </ContentPage.Content>
</ContentPage>

这是我的代码：

  public PopupBox()
        {
            try
            {
                InitializeComponent();
                NavigationPage.SetHasNavigationBar(this, false);
                sampleList.ItemsSource = new List<string>
            {
                "Test ListView",
                "Test ListView",
                "Test ListView", …

我无法在 angular 7 页面加载时显示 ng-bootstrap 模式弹出窗口。

我试过下面的代码来打开它。

openVerticallyCentered(content) {

this.modalService.open(content, { centered: true });.
this.modalService.open(content, { beforeDismiss: false });

}