Solved

Pop-Up calendar with asp.net, javascript, vb

Posted on 2010-08-30
3
928 Views
Last Modified: 2012-05-10
I'm having a hard time getting this to work.

I have an asp.net page called CreateNewPO with a textbox called txtReqCompDate and a link to a Pop-Up calendar (NewPoCalendar.aspx).

When I click a date on the calendar I want the Pop-Up calendar to close itself and txtReqCompDate to be populated with the date the user picked.

I'm getting this error: "Microsoft JScript runtime error: 'window.opener.document.forms.0.txtReqCompDate' is null or not an object"
CreateNewPO.aspx:

<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage2.master" AutoEventWireup="false" CodeFile="CreateNewPO.aspx.vb" Inherits="Creation_CreateNewPO_CreateNewPO" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <style type="text/css">
        .style7
        {
            width: 80%;
        }
        .style8
        {
            width: 862px;
            font-size: x-large;
        }
        .style9
        {
            width: 168px;
        }
        .style10
        {}
        .style12
        {
            text-align: left;
        }
        .style13
        {
            width: 214px;
            text-align: right;
        }
        .style14
        {
            width: 214px;
            text-align: right;
            height: 28px;
        }
        .style15
        {
            text-align: left;
            height: 28px;
            margin-left: 240px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
        <asp:Label ID="lblMessage" runat="server" Font-Italic="True" 
            ForeColor="#CC3300"></asp:Label>
    <br />
    <table align="center" class="style7">
        <tr>
            <td class="style8" style="text-align: left">
                Create a New Purchase Order</td>
            <td class="style9">
                <asp:Label ID="lblDate" runat="server" style="font-size: x-large"></asp:Label>
            </td>
        </tr>
    </table>
    <br />
    <table align="center" cellpadding="2" class="style10" 
            style="vertical-align: middle; text-align: center;">
        <tr>
            <td class="style13">
                Vendor</td>
            <td class="style12">
                <asp:Label ID="lblVendor" runat="server" Font-Bold="False" ForeColor="#003300"></asp:Label>
            </td>
        </tr>
        <tr>
            <td class="style13">
                Purchase Order Number</td>
            <td class="style12">
                <asp:TextBox ID="txtPONumber" runat="server" ForeColor="#003300" Width="217px"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td class="style13">
                Production Month</td>
            <td class="style12">
                <asp:DropDownList ID="drpProductionMonth" runat="server" ForeColor="#003300">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="style13">
                Production Year</td>
            <td class="style12">
                <asp:DropDownList ID="drpProductionYear" runat="server" ForeColor="#003300">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="style13">
                Ship To</td>
            <td class="style12">
                <asp:DropDownList ID="drpShipTo" runat="server" ForeColor="#003300">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="style13">
                Payment Type</td>
            <td class="style12">
                <asp:DropDownList ID="drpPaymentType" runat="server" ForeColor="#003300">
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td class="style14">
                Requested Completion Date</td>
            <td class="style15" valign="middle">
                <asp:TextBox ID="txtReqCompDate" runat="server" ForeColor="#003300" 
                    Width="172px"></asp:TextBox>
&nbsp;                
                <a href="javascript:;" onclick="window.open('NewPOCalendar.aspx?textbox=txtReqCompDate','cal','width=250,height=225,left=270,top=180')">
                <img src="../../img/CalendarIcon.jpg" border="0" alt="Show Calendar" 
                    style="height: 20px; width: 22px" /></a>
            </td>
        </tr>
        <tr>
            <td class="style14">
                &nbsp;</td>
            <td class="style15" valign="middle">
                &nbsp;</td>
        </tr>
    </table>
    <p>
    </p>
</asp:Content>

--------------------------------------------------
NewPoCalendar.aspx:

<%@ Page Language="vb" AutoEventWireup="false" Src="NewPOCalendar.aspx.vb" Inherits="NewPOCalendar1.PopUp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Calendar</title>
</head>
<body>
<form id="CreateNewPOCalendar" method="post" runat="server">
<asp:Calendar ID="calDate" OnSelectionChanged="Change_Date" Runat="server" />
<input type="hidden" id="control" runat="server" />
</form>
</body>
</html>


--------------------------------------------------
NewPoCalendar.aspx.vb:

Imports System.Web.UI.HtmlControls.HtmlGenericControl

Namespace NewPOCalendar1

    Public Class PopUp
        Inherits System.Web.UI.Page

        Protected WithEvents control As System.Web.UI.HtmlControls.HtmlInputHidden
        Protected WithEvents calDate As System.Web.UI.WebControls.Calendar

        Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Me.Load
            If Not IsPostBack Then
                control.Value = Request.QueryString("textbox").ToString()
            End If
        End Sub

        Protected Sub Change_Date(sender As System.Object, e As System.EventArgs)
            Dim strScript As String = "<script>window.opener.document.forms[0]." + control.Value + ".value = '"
            strScript += calDate.SelectedDate.ToString("MM/dd/yyyy")
            strScript += "';self.close()"
            strScript += "</" + "script>"
            RegisterClientScriptBlock("anything", strScript)
        End Sub

    End Class

End Namespace

Open in new window

0
Comment
Question by:Rick
  • 2
3 Comments
 
LVL 5

Expert Comment

by:darshan_derasari
ID: 33561398
I would like to recommend to use javascript calendar. Please refer below link for that... This achieves same functionality that you want to perorm.

http://www.nsftools.com/tips/DatePickerTest.htm
http://www.javascriptkit.com/script/script2/tengcalendar.shtml

Hope this helps.
0
 
LVL 13

Accepted Solution

by:
Rick earned 0 total points
ID: 33562165
0
 
LVL 13

Author Closing Comment

by:Rick
ID: 33562178
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

685 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question