Support us .Net Basics C# SQL ASP.NET ADO.NET MVC Slides C# Programs Subscribe Buy DVD

Opening new window using javascript in asp.net - Part 57

Suggested Videos
Part 54 - Server.execute in asp.net
Part 55 - Cross page postback
Part 56 - Cross page postback strongly typed reference



The following are the different page navigation techniques in asp.net
1. Hyperlink control - Discussed in Part 13 and Part 51 of the ASP.NET video series
2. Response.Redirect - Discussed in Part 52
3. Server.Transfer - Discussed in Part 53
4. Server.Execute - Discussed in Part 54
5. Cross-Page postback - Discussed in Part 55 and Part 56
6. Window.Open 

In this video we will discuss about, opening a new window using javascript method window.open(). First the syntax of the window.open() method.
window.open(URL, name, features, replace)



Parameter NameDescription
URL (Optional)The URL of the page to open. If URL is not specified, a new window with about:blank is opened.
Name (Optional)Specifies the target attribute or the name of the window.
  • name - The name of the window
  • _blank - Opens in a new window. Default, if nothing is specified.
  • _self - Opens in the same page
  • _parent - Loaded into the parent frame
  • _top - URL replaces any framesets that may be loaded
Features (optional)A comma-separated list of items.
  • resizable = yes|no or 0|1
  • scrollbars = yes|no or 0|1
  • toolbar = yes|no or 0|1
  • location = yes|no or 0|1(Specifies whether to display the Navigation Bar. The default is yes)
  • status = yes|no or 0|1
  • menubar = yes|no or 0|1
  • left = yes|no or pixels
  • top = yes|no or pixels
  • width = yes|no or pixels
  • height = yes|no or pixels
Replace(Optional) A boolean parameter that specifies whether the url creates a new entry or replaces the current entry in the window's history list. This parameter only takes effect if the url is loaded into the same window.
  • true - url replaces the current document in the history list.
  • false - url creates a new entry in the history list.


HTML of WebForm1.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Training Demo</title>
    <script type="text/javascript">
        // Javascript function to open the new window
        function OpenNewWindow() 
        {
            var Name = document.getElementById('txtName').value;
            var Email = document.getElementById('txtEmail').value;
            window.open('WebForm2.aspx?Name=' + Name + '&Email=' + Email, '_blank', 'toolbar=no, location=no, resizable=yes, 

width=500px, height=500px', true);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
<div style="font-family: Arial">
    <table>
        <tr>
            <td colspan="2">
                <h1>
                    This is WebForm1</h1>
            </td>
        </tr>
        <tr>
            <td>
                <b>Name</b>
            </td>
            <td>
                :<asp:TextBox ID="txtName" runat="server">
                </asp:TextBox>
            </td>
        </tr>
        <tr>
            <td>
                <b>Email</b>
            </td>
            <td>
                :<asp:TextBox ID="txtEmail" runat="server">
                </asp:TextBox>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input id="Button1" type="button" value="HTML Input Button - Window.Open" 
                    onclick="OpenNewWindow()" style="width: 300px"
                />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <asp:Button ID="Button2" runat="server" 
                    Text="ASP.NET Button - Window.Open()" onclick="Button2_Click" 
                    Width="300px" />
            </td>
        </tr>
        </table>
</div>
    </form>
</body>
</html>

Code-Behind code for WebForm1.aspx.cs
protected void Button2_Click(object sender, EventArgs e)
{
    string strJavascript = "<script type='text/javascript'>window.open('WebForm2.aspx?Name=";
    strJavascript += txtName.Text + "&Email=" + txtEmail.Text + "','_blank');</script>";
    Response.Write(strJavascript);
}

HTML of WebForm2.aspx
<div style="font-family: Arial">
    <table>
        <tr>
            <td colspan="2">
                <h1>This is WebForm2</h1>
            </td>
        </tr>
        <tr>
            <td>
                <b>Name</b>
            </td>
            <td>
                :<asp:Label ID="lblName" runat="server">
                </asp:Label>
            </td>
        </tr>
        <tr>
            <td>
                <b>Email</b>
            </td>
            <td>
                :<asp:Label ID="lblEmail" runat="server">
                </asp:Label>
            </td>
        </tr>
        </table>
</div>

Code-Behind code for WebForm2.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
    lblName.Text = Request.QueryString["Name"];
    lblEmail.Text = Request.QueryString["Email"];
}

2 comments:

  1. Very nice Sir, U r great. I would say more than excellent. I have watched almost all videos posted by you on youtube. Its a great help for all the students who wants to learn programming. You have helped the people in a great way. God Bless You Sir.

    ReplyDelete

If you like this website, please share with your friends on facebook and Google+ and recommend us on google using the g+1 button on the top right hand corner.