I am writing a web page, on this web page there is a txtStart and txtEnd. Next to them I have Calendar ImageButtons. I would like to code it so when the ImageButton is clicked a calendar popup appears and when they select a date on the popup it goes away and the date is populated into the txt. Format MM/DD/YYYY. Can anyone help me? I have been looking online for hours now and only find solutions for C# users or for a seperate page all together. I am writing my code in VB and I cannot make new pages. Here is my web page code:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="PSInventoryRelease.aspx.vb" Inherits="DigeControlCenter.PSInventoryRelease" %> 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="TC" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
  <title>Print Stream Inventory Release</title> 
  <script language="javascript" type="text/javascript"> 
  <form id="form1" runat="server"> 
  <asp:label id="lblError" runat="server"></asp:label> 
  <asp:ScriptManager ID="ScriptManager1" runat="server"/> 
  <TC:TabContainer runat="server" ID="Tabs" Width="1201px" ActiveTabIndex="1"> 
  <TC:TabPanel ID="Panel1" runat="server" HeaderText='Release Inventory'> 
      <br /> 
      <br /> 
      <asp:Label ID="Label2" runat="server" Text="Customer Name"></asp:Label> 
        ID="ddlCustomers" runat="server" Height="18px" 
        style="margin-left: 0px" Width="211px"> 
      <br /> 
      <br /> 
      <asp:Label ID="Label3" runat="server" Text="PSI #"></asp:Label> 
      <asp:TextBox ID="txtPSI" runat="server"></asp:TextBox> 
      <br /> 
      <br /> 
      <asp:Label ID="Label4" runat="server" Text="Item #"></asp:Label> 
      <asp:TextBox ID="txtItem" runat="server"></asp:TextBox> 
      <br /> 
      <br /> 
      <asp:Label ID="Label5" runat="server" Text="Qty"></asp:Label> 
      <asp:TextBox ID="txtQty" runat="server"></asp:TextBox> 
      <br /> 
      <br /> 
      <asp:Button ID="btnRelease" runat="server" Text="Release" Width="97px" /> 
      <br /> 
      <br />  
    <TC:TabPanel ID="TabPanel1" runat="server" HeaderText="Create Pull Sheet"> 
        <br /> 
        <br /> 
              <asp:Label ID="Label6" runat="server" Text="Start Date"></asp:Label> 
                <asp:TextBox ID="txtStart" runat="server"></asp:TextBox> 
        <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="images/icons/calendr5.gif"/> 
        <br /> 
         <br /> 
        <asp:Label ID="Label7" runat="server" Text="End Date"></asp:Label> 
        <asp:TextBox ID="txtEnd" runat="server"></asp:TextBox> 
        <asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="images/icons/calendr5.gif" style="width: 16px"/> 
        <br /> 
        <br /> 
        <asp:Label ID="Label8" runat="server" Text="Item #"></asp:Label> 
                     <asp:TextBox ID="txtItemNo" runat="server"></asp:TextBox> 
        <br /> 
        <br /> 
        <asp:Label ID="Label9" runat="server" Text="Job #"></asp:Label> 
                   <asp:TextBox ID="txtJobNo" runat="server"></asp:TextBox> 
        <br /> 
        <br /> 
        <br /> 
                  <asp:Button ID="btnCreate" runat="server" Text="Recreate" Width="121px" /> 
        <br /> 
        <br /> 

And this is my Code Behind. I am hoping to write the popup calendar code in the ImageButton1_Click event

Imports System 
Imports System.IO 
Imports System.Reflection 
Imports PSXSTL.Data 
Imports PSXSTL.Data.DataAccess 
Imports System.Data.SqlClient 
Imports System.Configuration 
Imports System.Configuration.ConfigurationManager 
Imports PSXSTL.Logging 
Imports System.Web.UI.WebControls 
Imports InfoSoftGlobal 
Imports AjaxControlToolkit 
Imports System.Text 
Imports System.Windows.Forms 
Imports PSXSTL.Digecenter 
Imports System.Web.UI.HtmlControls.HtmlGenericControl 
Partial Public Class PSInventoryRelease 
  Inherits System.Web.UI.Page 
  Dim myConnection As SqlClient.SqlConnection 
  Dim myCommand As SqlClient.SqlDataAdapter 
#Region " Web Form Designer Generated Code " 
  'This call is required by the Web Form Designer. 
  <System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent() 
  End Sub
  Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init 
    'CODEGEN: This method call is required by the Web Form Designer 
    'Do not modify it using the code editor. 
  End Sub
#End Region 
  Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load 
  End Sub
  Private Sub GetCustomers() 
    'Populate CustomerName from tblCustomers into ddlCustomers 
    myConnection = New SqlClient.SqlConnection(ConfigurationManager.AppSettings("dbConnectionString")) 
    myCommand = New SqlClient.SqlDataAdapter("SELECT CustomerName from tblcustomers ORDER BY CustomerName ASC", myConnection) 
    'Create and fill a DataSet  
    Dim ds As DataSet = New DataSet 
    'Bind to dataset  
    ddlCustomers.DataSource = ds.Tables(0) 
    ddlCustomers.DataTextField = "CustomerName"
    ddlCustomers.Items.Insert(0, New ListItem("Please Select a Customer")) 
  End Sub
  Protected Sub ddlCustomers_SelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs) Handles ddlCustomers.SelectedIndexChanged 
    'Populate PSI # in txtPSI based on Customer selected 
    Dim PSINumber As String = ""
    If ddlCustomers.SelectedIndex > 0 Then
      PSINumber = OMCustomerPSI.GetPSI(ddlCustomers.SelectedItem.ToString) 
      If PSINumber = "" Then
        MessageBox.Show("There is no PSI Number available. (Please create new PSI Number in Digecenter Manage Site.)") 
        Me.txtPSI.Text = PSINumber 
      End If
    End If
  End Sub
  Protected Sub ImageButton1_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles ImageButton1.Click 
  End Sub
End Class

Please help asap! Thanks!

Here's a simple example but with no button. The calender will appear when focus is in the field. You can still type freely and ignore the calender

<asp:TextBox ID="txtStartsAt" runat="server"></asp:TextBox>

<asp:CalendarExtender ID="txtStartsAt_CalendarExtender" runat="server"
Enabled="True" TargetControlID="txtStartsAt" Format="dd/MM/yyyy" TodaysDateFormat="MMMM dd, yyyy">

No other code is needed. The TargetControlID takes care of everything, no need for a button or anything in the codebehind.

This article has been dead for over six months. Start a new discussion instead.