locked
After first button click, page is not working correctly RRS feed

  • Question

  • User593583510 posted

    I am new to ASP.NET. Currently I am designing web site with 2 pages:

    • Page 1 have dropdown list and a few listboxes filled based on selection in dropdownlist and 1 button ("Run report"). When button is clicked, table is generated, then Server.Transfer ("Page2.aspx") used with table passed in Context.items.
    • Page 2 has report viewer control to show report. Page 1 button's OnClientClick function tells to open new page in new tab (target= _blank).

    All is working only for 1 button click / one report in the new tab. When I come back to Page 1 tab and click on the dropdown list to run another report, instead of showing dropdown list items, new tab opens with Page 1, with controls not working correctly.

    I cannot understand why this happens. Tried to set UseSubmitBehavior to false for the button. Still the same - dropdownlist click on the page 1 after first report, opens Page 1 in new tab.

    My goal is to generate/open multiple reports from the same page/tab. In other word, multiple tabs open with new reports all generated from the same Page 1 controls and button.

    Can you please give me any tip/direction to resolve this?

    Wednesday, October 10, 2018 11:51 PM

Answers

  • User-893317190 posted

    Hi Archy0001,

    You could change the target property of your form to  "_self" in  the dropdownlist's client side onchange event.

    Below is my code.

     <script type = "text/javascript">
            function SetTarget() {
                document.forms[0].target = "_blank";
            }
          window.onload = function () {
                document.getElementById("<%=DropDownList1.ClientID  %>")
                    .onchange = function () {
                     document.forms[0].target = "_self";
    __doPostBack("DropDownList1")
                    }
    
            }
        </script>
    
    
    

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 15, 2018 5:17 AM

All replies

  • User-893317190 posted

    Hi Archy0001,

    Only According to your description, it is hard to know what problem you have met.

    Could you post your codes about how you design your  2 pages and code behind of them?

    Best regards,

    Ackerly Xu

    Friday, October 12, 2018 6:01 AM
  • User593583510 posted

    Hi Ackerly Xu,

    Posting simplified version of my code to illustrate the problem.

    Page1.aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Page1.aspx.cs" Inherits="WebApplication2.Page1" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type = "text/javascript">
            function SetTarget() {
                document.forms[0].target = "_blank";
             }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
             <div>
                Select Something in dropdownlist to populate Listbox<asp:DropDownList ID="DropDownList1" runat="server" Height="16px" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" Width="142px" AutoPostBack="True">
                    <asp:ListItem></asp:ListItem>
                    <asp:ListItem>ddl item 1</asp:ListItem>
                    <asp:ListItem>ddl item 2</asp:ListItem>
                    <asp:ListItem>ddl item 3</asp:ListItem>
                </asp:DropDownList>
                <br />
                List Box Populated when dropdowlist idex changes&nbsp; <asp:ListBox ID="ListBox1" runat="server" Width="149px" SelectionMode="Multiple"></asp:ListBox>
                <br />
                Clicking &#39;Run report&#39; button opens Page2 in new tab
                <asp:Button ID="btnRunReport" runat="server" Text="Run Reprot" OnClick="btnRunReport_Click" OnClientClick = "SetTarget();" />
            </div>
        </form>
    </body>
    </html>
    

    Page1.aspx.cs

    using System;
    using System.Collections.Generic;
    
    namespace WebApplication2
    {
        public partial class Page1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
            {
                ListBox1.Items.Clear();
                switch (DropDownList1.SelectedValue)
                {
                    case "ddl item 1":
                        {
                            ListBox1.Items.Add("list item 1");
                            ListBox1.Items.Add("list item 2");
                            ListBox1.Items.Add("list item 3");
                            break;
                        }
                    case "ddl item 2":
                        {
                            ListBox1.Items.Add("list item 4");
                            ListBox1.Items.Add("list item 5");
                            ListBox1.Items.Add("list item 6");
                            break;
                        }
    
                }
            }
    
            protected void btnRunReport_Click(object sender, EventArgs e)
            {
                List<string> lst = new List<string>();
                foreach (int n in ListBox1.GetSelectedIndices())
                {
                    lst.Add(ListBox1.Items[n].Value);
                }
    
                Context.Items["reportlist"] = lst;
                Server.Transfer("Page2.aspx");
            }
        }
    }

    Page2.aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Page2.aspx.cs" Inherits="WebApplication2.Page2" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:Label ID="lblReportData" runat="server" Text=""></asp:Label>
            </div>
        </form>
    </body>
    </html>
    

    Page2.aspx.cs:

    using System;
    using System.Collections.Generic;
    
    namespace WebApplication2
    {
        public partial class Page2 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                List<string> replst = new List<string>();
                replst = (List<string>)Context.Items["reportlist"];
                foreach(string m in replst)
                {
                    lblReportData.Text += m + "<br/>";
                }
    
            }
    
           
        }
    }

    The problem is when after "Run Report" button clicked and Page2 opens in new tab, coming back to Page1 tab and clicking on Dropdownlist to change selection, opens new browser tab instead of displaying selected Listbox items on the same tab. New tab only supposed to open when "run report" button is clicked.  

    Saturday, October 13, 2018 1:32 AM
  • User-893317190 posted

    Hi Archy0001,

    You could change the target property of your form to  "_self" in  the dropdownlist's client side onchange event.

    Below is my code.

     <script type = "text/javascript">
            function SetTarget() {
                document.forms[0].target = "_blank";
            }
          window.onload = function () {
                document.getElementById("<%=DropDownList1.ClientID  %>")
                    .onchange = function () {
                     document.forms[0].target = "_self";
    __doPostBack("DropDownList1")
                    }
    
            }
        </script>
    
    
    

    The result.

    Best regards,

    Ackerly Xu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 15, 2018 5:17 AM
  • User593583510 posted

    This works perfectly! Thank you Ackerly Xu!

    I still don't understand why we need to write code to stop control from doing something it is not supposed to be doing. Or it does? Confused. 

    Monday, October 15, 2018 10:53 PM
  • User-893317190 posted

    Hi Archy0001,

    In your code , you write  document.forms[0].target = "_blank"; which changes the default rending rule of aspx page.

    If you don't write other code, it will rending aspx page according to the rule you have changed. So , if you want  other control's post back  to render normally,you should change the control's action to normal.

    This is why I write the code,in the code I write document.forms[0].target = "_self"; to change the render rule to normal and write  __doPostBack("DropDownList1") to make the control post back  so that the post back caused by the dropdownlist will return to normal.

    Best regards,   

    Ackerly Xu

    Tuesday, October 16, 2018 1:24 AM
  • User593583510 posted

    Hi  Ackerly Xu,

    Your explanation is very helpful. It makes sense. It also tells me I need to study more about render rules. Could you recommend some documentation related to this? How JavaScript changes default render of aspx page and its controls normal actions. 

    Maybe there is a better way to open Page2.aspx in a new Browser Tab then using document.forms[0].target = "_blank"? A way without changing default render of the Page1.aspx.

    Thank you!

    Tuesday, October 16, 2018 9:56 AM
  • User-893317190 posted

    Hi Archy0001,

    The target attribute of form decides the rendering rule of your page.

    You could refer to w3c's link https://www.w3schools.com/tags/att_form_target.asp

    I think there is another way to open a new window using js window.open.

    You could refer to https://www.w3schools.com/jsref/met_win_open.asp

    Best regards,

    Ackerly Xu

    Wednesday, October 17, 2018 1:29 AM