Jason's Calendar Input with ASP.NET DetailsView

**acoder** · Apr 16 '09, 05:00 PM

Can you post the client-side generated code instead of the server-side code (view source in the browser).

**wudever** · Apr 17 '09, 12:01 AM

I believe i need to do some coding in the Code Behind.
Veiwing code in Visual Web Developement

Code:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="test_Default" %>

<%@ Register assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" namespace="System.Web.DynamicData" tagprefix="cc1" %>

<!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>Testing</title>
    <script type="text/javascript" src="/ebs/calendarDateInput.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" 
            DataKeyNames="CandidateID" DataSourceID="ObjectDataSource1" 
            DefaultMode="Insert" GridLines="None" Height="50px" Width="125px">
            <FieldHeaderStyle Wrap="False" />
            <Fields>
                <asp:BoundField DataField="CandidateName" HeaderText="Name:" 
                    SortExpression="CandidateName">
                <ControlStyle Width="250px" />
                </asp:BoundField>
                <asp:TemplateField HeaderText="Birth Date:" SortExpression="CandidateBirthDate">
                    <EditItemTemplate>
                        <asp:TextBox ID="TextBox1" runat="server" 
                            Text='<%# Bind("CandidateBirthDate") %>'></asp:TextBox>
                    </EditItemTemplate>
                    <InsertItemTemplate>
                        <asp:TextBox ID="TextBox1" runat="server" 
                            Text='<%# Bind("CandidateBirthDate") %>' Visible="False"></asp:TextBox>
                           <script type="text/javascript">DateInput("BirthDate",true,"YYYYMMDD")</script>
                    </InsertItemTemplate>
                    <ItemTemplate>
                        <asp:Label ID="Label1" runat="server" Text='<%# Bind("CandidateBirthDate") %>'></asp:Label>
                    </ItemTemplate>
                    <ControlStyle Width="100px" />
                </asp:TemplateField>
                <asp:CommandField ButtonType="Button" CancelText="Reset" InsertText="Add" 
                    ShowInsertButton="True" />
            </Fields>
        </asp:DetailsView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
            InsertMethod="InsertCandidates" OldValuesParameterFormatString="original_{0}" 
            SelectMethod="GetCandidates" 
            TypeName="DataSet1TableAdapters.tblCandidatesTableAdapter">
            <InsertParameters>
                <asp:Parameter Name="CandidateName" Type="String" />
                <asp:Parameter Name="CandidateBirthDate" Type="String" />
            </InsertParameters>
        </asp:ObjectDataSource>
    </div>
    </form>
</body>
</html>

Code generated by Browser

Code:

<!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><title>
	Testing
</title>
    <script type="text/javascript" src="/ebs/calendarDateInput.js"></script>
<link href="../App_Themes/Default/StyleSheet.css" type="text/css" rel="stylesheet" /></head>
<body>
    <form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="0vb2yGKDrJQA8HmJomdqk35fuuGN5uXWSiFsIC2rNVbCrKgyk25wu4aVnI4xogmtKyByWDRa2scEJJS4RPeacwAl8TGpGDMbitNCoEJjZtXPsA2UKI/Eawh5i+vGloXrywLxy81+tXopvrP9bEn2vyMH+BGm3ccruJFNCMEqs0M6S6nfQGdw4UU4cfoQfFVqDQeetA/Kumq0W+G0s//TBA==" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>
<div>
	<input type="hidden" name="__VIEWSTATEENCRYPTED" id="__VIEWSTATEENCRYPTED" value="" />
	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="Y/0ycn2sAEM1oPMnlFLymu1MRjZwBhGCr/L+Z4Ufj0PhZyyI5PpUtQStnWM6Qcgw" />
</div>
    <div>
        <div>
	<table cellspacing="0" border="0" id="DetailsView1" style="height:50px;width:125px;border-collapse:collapse;">
		<tr>
			<td style="white-space:nowrap;">Name:</td><td><input name="DetailsView1$ctl01" type="text" title="Name:" style="width:250px;" /></td>
		</tr><tr>
			<td style="white-space:nowrap;">Birth Date:</td><td>
                           <script type="text/javascript">DateInput("BirthDate",true,"YYYYMMDD")</script>
                    </td>
		</tr><tr>
			<td colspan="2"><input type="submit" name="DetailsView1$ctl02" value="Add" />&nbsp;<input type="button" value="Reset" onclick="javascript:__doPostBack('DetailsView1','Cancel$-1')" /></td>
		</tr>
	</table>
</div>
    </div>
    </form>
</body>
</html>

Thanks

**acoder** · Apr 20 '09, 11:43 AM

If that's the case, you'd be better off asking in the ASP.NET forum. However, note that once the page loads, server-side code doesn't run (unless using Ajax) and to interact with the page, you'll need to use JavaScript.

**wudever** · Apr 20 '09, 12:02 PM

Jason's Calendar Input with ASP.NET DetailsView

I'm currently creating a web page in ASP.NET and would like to use Jason's Input Calendar as well. I hope someone can help me with a problem that I am facing.

I have a form where I can add new customers. Most of the fields have the following tags within the DetailsView.

Code:

<asp:BoundField DataField="First Name" HeaderText="FirstName"></asp>

As for the Birth Date field, I had converted it to TemplateField. The following is the code:-

Code:

<asp:TemplateField ... > 
<InsertItemTemplate> 
  <asp:TextBox ID="TextBox1" runat="server" Text="" Visible="false"></asp:TextBox> 
  <script type="text/javascript">DateInput("BirthDate",true,"YYYYMMDD")</script> 
</InsertItemField>

How do i get the value of "BirthDate" into TextBox1? I'm coding in VB.

My original post can be found <snipped: no longer valid, posts have been moved into this thread>.

Thank you

**Frinavale** · Apr 20 '09, 02:28 PM

Can you please post the JASON Object that you are using for this calendar.
Specifically could you post the JavaScript/JASON code for the DateInput() function.

-Frinny

**wudever** · Apr 20 '09, 02:52 PM

Jason's JavaScript Calender can be found here or here.

In classic ASP, if I have the following code:-

Code:

<form action="something.asp" method="get">
<script type="text/javascript">DateInput("BirthDate",true)</script>
<input type="submit" value="Submit" />
</form>

all I need to do to get the value is to do as follows:-

Code:

bDate = Request.QueryString("BirthDate")

Thanks.

**Frinavale** · Apr 20 '09, 03:16 PM

Haha :)
I thought it was JASON (JSON) calendar...not a Calendar created by some guy named Jason :)

This script dynamically created HTML on the page.
It creates <select> elements for the month and the day; it creates a text box for the year; and it creates a hidden field with the current selected date.

The problem is that it's dynamically created HTML which means you cannot access it in your Server Side VB code like you would a DropDownList, or TextBox or ASP HiddenField.

You might be able to access the hidden field using the Request.Params( 'hiddenFieldID' )....

Give that a try.
If it doesn't work we can look at changing your solution to use ASP controls (like the Ajax Toolkit's Calendar control) instead of HTML elements that are not easily accessible in your VB code.

**wudever** · Apr 20 '09, 11:29 PM

I found a solution to this problem.

In the

Code:

<InsertParameters>

tags, remove

Code:

<asp:TextBox ID="TextBox1" ...</asp>

and replace with the script

Code:

<script type="text/javascript">DateInput("CandidateBirthDate",true,"YYYY-MM-DD")</script>

Within the

Code:

<asp:OBjectDataSource ...>

tags, look for

Code:

<InsertParameters>

tags and replace

Code:

<asp:Parameter Name="CandidateBirthDate" Type="String" />

with

Code:

<asp:FormParameter FormField="CandidateBirthDate" Name="CandidateBirthDate" Type="String" />

I suppose it should also work with the <UpdateParamete rs>.

**wudever** · Apr 21 '09, 04:24 AM

Ok, I've got another one.

Code:

<script type="text/javascript>DateInput("BirthDate",true,"YYYY-MM-DD",DisplayDate)</script>

DisplayDate is the date to be displayed in browser.

Question:
1) How do I create variable DisplayDate?
2) How do I add value from a database to DisplayDate?

The script is still in DetailsView, in the <EditItemTempla te> tags.

Thank you.

**acoder** · Apr 21 '09, 10:14 AM

Originally posted by Frinavale

I thought it was JASON calendar...not a Calendar created by some guy named Jason :)

I'd just point out that the data interchange format is called JSON (though you would probably read it as "Jason").

**Frinavale** · Apr 21 '09, 01:22 PM

Hehe it sounds all the same in my head :)
I'm not very familiar with JSON. I've only read about it and haven't actually had the chance to use it yet. I keep my eyes open for an opportunity though :)

Jason's Calendar Input with ASP.NET DetailsView

Jason's Calendar Input with ASP.NET DetailsView

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment