Member 11644373 Ответов: 1

Всплывающее окно отображается неправильно


Привет, команда, на самом деле я пытаюсь показать конкретный div в своем коде, но div, который я пытаюсь отобразить во всплывающих окнах в течение 1 секунды, затем исчезает.Так что может ли кто-нибудь помочь мне в этом вот мой файл aspx
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link href="App_Themes/StyleSheet3.css" rel="stylesheet" />
    <script type="text/javascript" src="Scripts/Timer/jquery.ui.timepicker.js?v=0.3.3"></script>
    <link rel="stylesheet" href="Scripts/Timer/jquery.ui.timepicker.css?v=0.3.3" type="text/css" />
    <link href="CSS/CustomShared.css" rel="stylesheet" />

</asp:Content>


<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <style>
			.ontop {
				z-index: 999;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				display: none;
				position: absolute;				
				background-color: #cccccc;
				color: #aaaaaa;
				opacity: .4;
				filter: alpha(opacity = 50);
			}
			#popup {
				width: 300px;
				height: 200px;
				position: absolute;
				color: #000000;
				background-color: #ffffff;
				/* To align popup window at the center of screen*/
				top: 50%;
				left: 50%;
				margin-top: -100px;
				margin-left: -150px;
			}
		</style>
		<script type="text/javascript">
		    function pop(div) {
		        document.getElementById(div).style.display = 'block';
		    }
		    function hide(div) {
		        document.getElementById(div).style.display = 'none';
		    }
		    //To detect escape button
		    document.onkeydown = function (evt) {
		        evt = evt || window.event;
		        if (evt.keyCode == 27) {
		            hide('popDiv');
		        }
		    };
		</script>
    <div class="clear"></div>
    <hr />
    <div>
            <asp:FileUpload ID="FileUpload1" runat="server" ForeColor="Red" />
            <asp:RegularExpressionValidator 
            id="FileUpLoadValidator" runat="server" 
            ErrorMessage="Upload only xlsx." 
            ValidationExpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))(.xlsx)$" 
            ControlToValidate="FileUpload1" ForeColor="Red"></asp:RegularExpressionValidator>
    
            <asp:Button id="UploadBtn" Text="Upload File"  OnClick="UploadBtn_Click" runat="server" Width="105px" />
            <asp:Label ID="lblMessage" ForeColor="Red" runat="server"></asp:Label>
        </div>
    <asp:GridView ID="gvDetails" runat="server" CssClass="grid clsWrap" AutoGenerateColumns="False"  PageSize="20" Width="960px">
        <Columns>
            <asp:BoundField DataField="taskdescription" HeaderText="Work Item"></asp:BoundField>
            <asp:BoundField DataField="fromdate" HeaderText="From Date"></asp:BoundField>
            <asp:BoundField HeaderStyle-CssClass="gridB" DataField="todate" HeaderText="To Date"></asp:BoundField>

        </Columns>
        <HeaderStyle Font-Bold="False" CssClass="Font gvheaderstyle" Wrap="False" />
        <PagerStyle CssClass="gridB" ForeColor="WhiteSmoke" />
        <RowStyle HorizontalAlign="Center" />
    </asp:GridView>
     <%--Start--%>
      <div class="name">Manual Insert Task</div>
    <hr />
    <br />
    <br />
     <div class="clear"></div>
    <div id="error" style="padding-left: 10px" runat="server" visible="true">
        <asp:Label ID="lblError" runat="server" ForeColor="Red"></asp:Label>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="Black" ForeColor="White" BorderColor="white"  OnRowCommand="GridView1_RowCommand" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" AllowPaging="True" OnPageIndexChanging="GridView1_PageIndexChanging" PageSize="5" BorderWidth="2px" CellPadding="2" CellSpacing="5" GridLines="None" >
           
            <RowStyle BackColor="Black" />
                <AlternatingRowStyle BackColor="Black" />
                <FooterStyle BackColor="Black" />
                <HeaderStyle BackColor="#ff9933" Font-Bold="True" ForeColor="Black" />
                <PagerStyle BackColor="#ff9933" ForeColor="Black"
                    HorizontalAlign="Center" />
                <SortedAscendingCellStyle BackColor="#F1F1F1" />
                <SortedAscendingHeaderStyle BackColor="#ff9933" />
                <SortedDescendingCellStyle BackColor="Black" />
                <SortedDescendingHeaderStyle BackColor="#00547E" />

             <Columns>
                <asp:TemplateField HeaderText="Task Id">
                    <ItemTemplate>
                        <asp:Label ID="lblTaskId" Text='<%# Eval("TaskId") %>' runat="server" ></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>                           
                <asp:TemplateField HeaderText="Description">
                    <ItemTemplate>
                        <asp:Label ID="lblDescription" Text='<%# Eval("Description") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Project Name">
                    <ItemTemplate>
                        <asp:Label ID="lblProjectName" Text='<%# Eval("ProjectName") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Area">
                    <ItemTemplate>
                        <asp:Label ID="lblArea" Text='<%# Eval("Area") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Work Type">
                    <ItemTemplate>
                        <asp:Label ID="lblWorkType" Text='<%# Eval("WorkItemType") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Channel">
                    <ItemTemplate>
                        <asp:Label ID="lblChannel" Text='<%# Eval("Channel") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Tags">
                    <ItemTemplate>
                        <asp:Label ID="lblTags" Text='<%# Eval("Tags") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Team Name">
                    <ItemTemplate>
                        <asp:Label ID="lblTeamName" Text='<%# Eval("TeamName") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Task Name">
                    <ItemTemplate>
                        <asp:Label ID="lblTaskName" Text='<%# Eval("TaskName") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Edit">
                    <ItemTemplate>
                        <asp:Button ID="btnEdit" runat="server" Text="Edit" CommandName="EditRow" CausesValidation="false"/>
                    </ItemTemplate>
                </asp:TemplateField>             
            </Columns>
        </asp:GridView>    
    </div>
    <br />
    <div>
        <table>
        <tr>
        <td style="position:relative; left:-35%;"><a href="#" onClick="pop('popDiv')"> <asp:Button ID="btnadd" ValidationGroup="tab2" CssClass="col-centered ts-btn normalbtnsize" runat="server" Text="Add" BackColor="#ff9933" OnClick="btnadd_Click"/></a></td>          
        </tr>
        </table>
    </div>
    <br />
    <div class="clear"></div>
    <div id="popDiv" class="ontop"  >
        <div id="fade" class="black_overlay"></div>
        <div id="tab1" class="tab active">
            <table  class="formwrap center-block2">
               <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Task Id
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="txtEmpId" ClientIDMode="Static" placeholder="Task Id" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server" MaxLength="5"></asp:TextBox>
                                </td>
                                <td >
                                    <asp:RequiredFieldValidator ID="rfvEmpId" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Task Id cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>
                                    <
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
                  <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Description
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table >
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox1" ClientIDMode="Static" placeholder="Description" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                 <td style="padding-left:200px;">
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Description cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Project Name
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox2" ClientIDMode="Static" placeholder="Project Name" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Project Name cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Area
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox3" ClientIDMode="Static" placeholder="Area" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Area cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Work Type
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox4" ClientIDMode="Static" placeholder="Work Type" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Work Type cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Channel
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox5" ClientIDMode="Static" placeholder="Channel" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Channel cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Tags
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox6" ClientIDMode="Static" placeholder="Tags" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Tags cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Team Name
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>   
                                <td >
                        <asp:DropDownList ID="List" CssClass="ts-inputbox4 left" runat="server" style="width:220px">
                            <asp:ListItem Value="-1">-SELECT-</asp:ListItem>
                            <asp:ListItem Text="Abacus" Value="Analysis"></asp:ListItem>
                             <asp:ListItem Text="MMR" Value="Planning"></asp:ListItem>
                              <asp:ListItem Text="Product" Value="Execution"></asp:ListItem>                            
                        </asp:DropDownList>
                               </td>
                            </tr>

                        </table>
                    </td>
                </tr>
              <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Task Name
                        <label style="color: #FF3300">*</label></td>
                    <td class="auto-style4">
                        <table>
                            <tr>
                                <td>
                                    <asp:TextBox ID="TextBox9" ClientIDMode="Static" placeholder="Task Name" CssClass="ts-inputbox4 left" ValidationGroup="tab1" runat="server"></asp:TextBox>
                                </td>
                                <td>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server" ControlToValidate="txtEmpId" ErrorMessage="Task Name cannot be blank" Display="None" ForeColor="#FF3300"></asp:RequiredFieldValidator>

                                </td>
                            </tr>

                        </table>
                      </td>      
                </tr>  
              </table>
            <br />
            <table>
             <tr>                           
                  <td style="position:relative; right:15%;"><asp:Button  ID="btnsubmit" ValidationGroup="tab2" CssClass="col ts-btn normalbtnsize" runat="server" Text="Submit" BackColor="#ff9933"/></td>
                  <td style="position:relative; left:-17%;"> <asp:Button ID="btnfinddata" ValidationGroup="tab2" CssClass="col-centered ts-btn normalbtnsize" runat="server" Text="Cancel" BackColor="#ff9933"  /></td>
                                
                </tr>
                </table>
            </div>
        </div> 


Что я уже пробовал:

При нажатии на эту кнопку
<table>
        <tr>
        <td style="position:relative; left:-35%;"><a href="#" onClick="pop('popDiv')"> <asp:Button ID="btnadd" ValidationGroup="tab2" CssClass="col-centered ts-btn normalbtnsize" runat="server" Text="Add" BackColor="#ff9933" OnClick="btnadd_Click"/></a></td>          
        </tr>
        </table>

я пытаюсь показать этот div


<div class="clear"></div>
    <div id="popDiv" class="ontop"  >
        <div id="fade" class="black_overlay"></div>
        <div id="tab1" class="tab active">
            <table  class="formwrap center-block2">
               <tr>
                    <td class="auto-style5"></td>
                    <td class="auto-style7"style="color:#fff">Task Id
                        <label style="color: #FF3300">*</label></td>

Karthik_Mahalingam

что делает событие btnadd_Click?

Member 11644373

в настоящее время он просто отображает div всякий раз, когда нажимается кнопка

но с помощью btnadd_click я хочу показать это во всплывающем окне

F-ES Sitecore

Когда вы нажимаете кнопку, div отображается, но вы также отправляете форму, поэтому запрашивается новая копия страницы и переходите к ней, чтобы страница "сбрасывалась" обратно к тому, как она загружается. Если вам не нужен серверный код для запуска при нажатии на кнопку, то используйте обычную кнопку отправки html и отмените отправку формы при нажатии на нее. Это делается с помощью того, что "onclick" возвращает false. Google для точного синтаксиса.

Если вам действительно нужен серверный код для запуска при нажатии этой кнопки, то вам нужно будет показать всплывающее окно при загрузке после отправки формы, а не при нажатии кнопки.

1 Ответов

Рейтинг:
1

Kornfeld Eliyahu Peter

Когда вы нажимаете эту кнопку (которая на самом деле является ASP.NET кнопка, завернутая в якорь), происходят две вещи:
1. клиентская сторона onclick якоря, который отображает всплывающее окно
2. Серверный onclick кнопки, которая перезагружает всю страницу...
Таким образом, вы видите всплывающее окно только во время перезагрузки страницы...
Вы должны понять, что такое post и post-back. Что такое разделение клиента и сервера. Что такое Аякс.
И что вы на самом деле хотите сделать при создании такого гибридного кода?..