Hello, in the client side javascript I would like to display the selected date in a textbox. When I read the oDatevalue and show it via the Alert function, I see the full date and time. How I can put this date (only) in the ASP.NET textbox named txtDate. The problem is that javscript doesn't know the field txtDate in the rendered page I think and I don't know to put it in the textbox. How to achieve this? Thanks in advance.Ps. the webcalendar is placed on a template field column from a standard ASP.NET webgrid. (Insert Item template)
<script type="text/javascript" id ="Infragistics">
function fDateClicked(oCalendar, oDate, oEvent) {
txtdate.text=oDate
</
}
arjanxp,
You will have to use javascript to break up the oDate variable into pieces (month, date, year), and then put the pieces together. For example:
var month = oDate.getMonth() + 1; //month is zero-based, so add 1 var day = oDate.getDate(); var year = oDate.getYear(); var text = month +"/" + day + "/" + year; var textbox = document.getElementById("TextBox1"); textbox.value = text;
So if you selected today's date, March 24, 2009 in the WebCalendar, the text in the TextBox will read "3/24/2009".
Hope this helps,
~Kim~
Hello Ho, thanks for you help so far. The script looks good only I receive an error:
'Can't Eval fDateClicked(oControl, ig_fireEvent.arguments[2], ig_fireEvent.arguments[3]);'
This I have in my .aspx page:
<script type="text/javascript" id="Infragistics"> function fDateClicked(oCalendar, oDate, oEvent) { //Add code to handle your event here. var month = oDate.getMonth() + 1; //month is zero-based, so add 1 var day = oDate.getDate(); var year = oDate.getYear(); var text = month + "/" + day + "/" + year; var textbox = document.getElementById("txtDate"); textbox.value = text; }
</script>
Thanks in advance.
Hello Kim, thanks again. It's pretty much of code. The idea of this page: it contains a ASP.NET webgrid and I open this in the Insert record mode. In a template field I've put the Infragistics calendar control as you can find here down below. The calendar is visible, user picks a date and shows up in the textbox, txtDate. After filling in the further fields, they will click the Save button of the Grid and the postback saves the new record.
<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Masterpage.Master" CodeBehind="audit_add.aspx.vb" Inherits="AuditDB.audit_add" %>
<%@ Register assembly="Infragistics2.WebUI.WebDateChooser.v8.3, Version=8.3.20083.2039, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.WebUI.WebSchedule" tagprefix="igsch" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript" id="Infragistics">
function fDateClicked(oCalendar, oDate, oEvent) { var month = oDate.getMonth() + 1; //month is zero-based, so add 1 var day = oDate.getDate(); var year = oDate.getYear(); var text = month + "/" + day + "/" + year; var textbox = document.getElementById("txtDate"); textbox.value = text; }
</script></asp:Content><asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <table> <tr> <td width="800px" align="center"> <strong style="text-align: center; font-size: medium;"> <asp:Label ID="lblID" runat="server" Text="Add new Audit Finding"></asp:Label></strong> </td> </tr> </table> <asp:Label ID="lblMsg" runat="server" ForeColor="Red"></asp:Label> <asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" CellPadding="4" DataKeyNames="FindingID" DataSourceID="dsFindings" ForeColor="Black" Height="131px" Width="800px" Font-Names="Verdana" Font-Size="X-Small" BorderStyle="Solid" BorderWidth="1px"> <FooterStyle BackColor="White" Font-Bold="True" ForeColor="White" /> <CommandRowStyle BackColor="#FF7300" Font-Bold="True" /> <RowStyle BackColor="white" /> <FieldHeaderStyle BackColor="#FF7300" Font-Bold="True" ForeColor="Black" Width="150px" /> <PagerStyle BackColor="White" ForeColor="White" HorizontalAlign="Center" /> <Fields> <asp:CommandField UpdateText="Save" NewText="New Audit" ShowInsertButton="True" InsertText="Save"> <ItemStyle Font-Names="Verdana" Font-Size="Small" ForeColor="White" /> </asp:CommandField> <asp:BoundField DataField="FindingID" HeaderText="Finding ID" InsertVisible="False" ReadOnly="True" SortExpression="FindingID"> <HeaderStyle Width="200px" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:TemplateField HeaderText="Company Name" SortExpression="CompanyName"> <EditItemTemplate> <asp:TextBox ID="TextBox6" runat="server" Text='<%# Bind("CompanyName") %>'></asp:TextBox> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="TextBox10" runat="server" Text='<%# Bind("CompanyName") %>' Width="300px"></asp:TextBox> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label6" runat="server" Text='<%# Bind("CompanyName") %>'></asp:Label> </ItemTemplate> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" Width="400px" /> <HeaderStyle Font-Names="Verdana" Font-Size="X-Small" Height="15px" Width="200px" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" Height="15px" /> </asp:TemplateField> <asp:BoundField DataField="CompanyCode" HeaderText="Company Code" SortExpression="CompanyCode"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <HeaderStyle Font-Names="Verdana" Font-Size="X-Small" Width="200px" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:BoundField DataField="WIOLocation" HeaderText="WIO Location" SortExpression="WIOLocation"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <HeaderStyle Width="200px" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:BoundField DataField="Period" HeaderText="Period" SortExpression="Period"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:BoundField DataField="ReportType" HeaderText="Report Type" SortExpression="ReportType"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:BoundField DataField="ProblemAreas" HeaderText="Problem Areas" SortExpression="ProblemAreas"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:BoundField DataField="Observation" HeaderText="Observation" SortExpression="Observation"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:TemplateField HeaderText="Subject" SortExpression="Subject"> <EditItemTemplate> <asp:TextBox ID="TextBox7" runat="server" Text='<%# Bind("Subject") %>'></asp:TextBox> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="TextBox7" runat="server" Text='<%# Bind("Subject") %>' Width="640px"></asp:TextBox> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label7" runat="server" Text='<%# Bind("Subject") %>'></asp:Label> </ItemTemplate> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:TemplateField> <asp:BoundField DataField="Status" HeaderText="Status" SortExpression="Status"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:TemplateField HeaderText="Responsible as per Audit Report" SortExpression="RespPerson"> <EditItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("RespPerson") %>'></asp:TextBox> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="TextBox9" runat="server" Text='<%# Bind("RespPerson") %>' Width="640px" Font-Names="Verdana" Font-Size="X-Small"></asp:TextBox> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label1" runat="server" Text='<%# Bind("RespPerson") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="WIO Assigned Responsible" SortExpression="WIO_Responsible"> <EditItemTemplate> <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("WIO_Responsible") %>'></asp:TextBox> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="TextBox8" runat="server" Font-Names="Verdana" Font-Size="X-Small" Text='<%# Bind("WIO_Responsible") %>' Width="640px"></asp:TextBox> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label2" runat="server" Text='<%# Bind("WIO_Responsible") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Interest Party" SortExpression="InterestParty"> <InsertItemTemplate> <asp:TextBox ID="TextBox3" runat="server" Font-Names="Verdana" Font-Size="X-Small" Text='<%# Bind("InterestParty") %>' Width="640px"></asp:TextBox> </InsertItemTemplate> <EditItemTemplate> <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("InterestParty") %>'></asp:TextBox> </EditItemTemplate> <ItemTemplate> <asp:Label ID="Label3" runat="server" Text='<%# Bind("InterestParty") %>'></asp:Label> </ItemTemplate> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:TemplateField> <asp:BoundField DataField="CIPNumber" HeaderText="CIP Number" SortExpression="CIPNumber"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" Width="100px" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:BoundField> <asp:TemplateField HeaderText="Implication" SortExpression="Implication"> <EditItemTemplate> <asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("Implication") %>'></asp:TextBox> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="TextBox5" runat="server" Font-Names="Verdana" Font-Size="X-Small" Height="75px" Text='<%# Bind("Implication") %>' TextMode="MultiLine" Width="640px"></asp:TextBox> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label4" runat="server" Text='<%# Bind("Implication") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Solution Deadline" SortExpression="SolutionDeadline_audit"> <EditItemTemplate> <asp:TextBox ID="txtDate" runat="server" Text='<%# Bind("SolutionDeadline_audit","{0:dd.MM.yyyy}" ) %>' Font-Names="Verdana" Font-Size="X-Small" Width="85px"></asp:TextBox> <asp:Label ID="Label8" runat="server" Font-Names="Verdana" Font-Size="X-Small" Text=" Example: 15.12.2008"></asp:Label> </EditItemTemplate> <InsertItemTemplate> <asp:TextBox ID="txtDate" runat="server" Text='<%# Bind("SolutionDeadline_audit") %>' Font-Names="Verdana" Font-Size="X-Small" Width="85px"></asp:TextBox> <asp:Label ID="Label9" runat="server" Font-Names="Verdana" Font-Size="X-Small" Text=" Example: 15.12.2008"></asp:Label> <igsch:WebCalendar ID="WebCalendar1" runat="server" ClientSideEvents-DateClicked="fDateClicked"> </igsch:WebCalendar> </InsertItemTemplate> <ItemTemplate> <asp:Label ID="Label5" runat="server" Text='<%# Bind("SolutionDeadline_audit", "{0:dd.MM.yyyy}") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:CheckBoxField DataField="SolutionPlanAvail_audit" HeaderText="Solution plan Available" SortExpression="SolutionPlanAvail_audit"> <ControlStyle Font-Names="Verdana" Font-Size="X-Small" /> <ItemStyle Font-Names="Verdana" Font-Size="X-Small" /> </asp:CheckBoxField> </Fields> <HeaderStyle BackColor="White" Font-Bold="True" ForeColor="White" /> <InsertRowStyle Width="500px" /> <EditRowStyle BackColor="White" /> <AlternatingRowStyle BackColor="White" /> </asp:DetailsView> <asp:ObjectDataSource ID="dsFindings" runat="server" SelectMethod="GetData" TypeName="AuditDB.AuditDataSetTableAdapters.tbl_AuditsTableAdapter" DeleteMethod="Delete" InsertMethod="Insert" UpdateMethod="Update"> <DeleteParameters> <asp:Parameter Name="FindingID" Type="Int32" /> </DeleteParameters> <UpdateParameters> <asp:Parameter Name="CompanyName" Type="String" /> <asp:Parameter Name="CompanyCode" Type="String" /> <asp:Parameter Name="WIOLocation" Type="String" /> <asp:Parameter Name="Period" Type="String" /> <asp:Parameter Name="ReportType" Type="String" /> <asp:Parameter Name="ProblemAreas" Type="String" /> <asp:Parameter Name="Observation" Type="String" /> <asp:Parameter Name="Subject" Type="String" /> <asp:Parameter Name="Status" Type="String" /> <asp:Parameter Name="RespPerson" Type="String" /> <asp:Parameter Name="InterestParty" Type="String" /> <asp:Parameter Name="CIPNumber" Type="Double" /> <asp:Parameter Name="Implication" Type="String" /> <asp:Parameter Name="SolutionPlanAvail_audit" Type="Boolean" /> <asp:Parameter Name="SolutionDeadline_audit" Type="DateTime" /> <asp:Parameter Name="FindingID" Type="Int32" /> </UpdateParameters> <InsertParameters> <asp:Parameter Name="CompanyName" Type="String" /> <asp:Parameter Name="CompanyCode" Type="String" /> <asp:Parameter Name="WIOLocation" Type="String" /> <asp:Parameter Name="Period" Type="String" /> <asp:Parameter Name="ReportType" Type="String" /> <asp:Parameter Name="ProblemAreas" Type="String" /> <asp:Parameter Name="Observation" Type="String" /> <asp:Parameter Name="Subject" Type="String" /> <asp:Parameter Name="Status" Type="String" /> <asp:Parameter Name="RespPerson" Type="String" /> <asp:Parameter Name="InterestParty" Type="String" /> <asp:Parameter Name="CIPNumber" Type="Double" /> <asp:Parameter Name="Implication" Type="String" /> <asp:Parameter Name="SolutionPlanAvail_audit" Type="Boolean" /> <asp:Parameter Name="SolutionDeadline_audit" Type="DateTime" /> </InsertParameters> </asp:ObjectDataSource> <br /></asp:Content>
Thanks for posting the code. The reason you're getting the javascript error is because of the master/content page scenario- controls on the content page have their ClientIds pre-pended to avoid ambiguities between controls with the same ID on different pages. To resolve this, change the line of javascript that creates the textbox variable to:
var textbox = document.getElementById("<%= txtDate.ClientId %>");
This syntax grabs the ClientId of the textbox, which is something like "ctl00_ContentPlaceHolder1_txtDate", and uses that to get the correct control.
Hello Kim, thanks for your answer. I think that your answer is correct, but I only receive a strange error : 'Name 'txtDate' is not declared'
The error points to the first lines of the code, I underlined them also, so the error points to the designer page I presume, but there are never controls present which stays in TemplateFields.I saw the same error description before on an AJAX page when it didn't recognize my ScriptManager. This had also to do with the masterpage scenario. Do you know a solution to this problem? Because when I build, it says no errors, but it shows 1 error as mentioned in the listbox. I can run my page but when I move to this page I get the error as well.When I comment out the whole javascript block, the error disappears. When I only comment the line with txtDate in it, the error remains...strange.
Thanks in advance!
function fDateClicked(oCalendar, oDate, oEvent) { var month = oDate.getMonth() + 1; //month is zero-based, so add 1 var day = oDate.getDate(); var year = oDate.getYear(); var text = month + "/" + day + "/" + year;// var textbox = document.getElementById("txtDate"); var textbox = document.getElementById("<%= txtDate.ClientID %>"); textbox.value = text; }
I've created a sample that works around the limitation of not finding the txtDate textbox because it is in the DetailsView InsertItemTemplate. It uses a hidden field which contains the ClientID of the textbox. I am handling the DetailsView's server side DataBound event, checking to see what the CurrentMode is, and if it is in Insert mode, setting the value of the hidden field to the ClientID of the textbox.
Hello Kim, this is a nice workaround. Thank you very much. So the conclusion is that it's not possible to point directly to a field in a detailsview templatefield from within javascipt without this hiddenfield option?
I'm not sure that's absolutely true, however I did some research prior to creating the sample for you and that was the only way I could find to get a reference to the control in the DetailsView's Templatefield.