By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,846 Members | 1,589 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,846 IT Pros & Developers. It's quick & easy.

getElementById with edit mode of datagrid control

P: n/a
How I can get element ID in the edit mode of datagrid control?

If I not in the edit mode, there are no problem.
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a href='javascript:showCalendar(frmForm.imgDateStatu t,
document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

The command document.getElementById("txtDateStatut") don't working in edit
mode.
Tried frmForm.txtDateStatut but don't working also.

Please help me...

Thanks
Jul 21 '05 #1
Share this Question
Share on Google+
8 Replies


P: n/a
hi Gilles,
the controls ID is not what you think it is --its a child control --the
datagrid autogenerates a unique id for this. Try to get it by classname
whereas to by ID is the only workaround i can think off the top of my head
;P

See the controls ID in the viewsource after running the page to test if this
is the case ;)

if this is the case you could work around it like this :

Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object, ByVal
e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dataGridManufacturer.ItemDataBound
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus = CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox)
HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"),
HyperLink)
DateStatus.ID
hyperlink1.NavigateUrl =
"javascript:showCalendar(frmForm.imgDernieresResol utions,
document.getElementById(""" & Datestatus.ID & """), ""yyyy-mm-dd"","""",1)"
End If
End Sub
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></asp:HyperLink>
</EditItemTemplate>
</asp:TemplateColumn>
Ok, thats what i would do, however know that i have not tested this
code --but you do get the idea ;)
and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox) looks in cell zero on my code --look to see on which cell you have
the textbox and link button and then use the findcontrol there ;P

"Gilles T." <gi************@hotmail.com> wrote in message
news:Vk*********************@news.easynews.com...
How I can get element ID in the edit mode of datagrid control?

If I not in the edit mode, there are no problem.
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a href='javascript:showCalendar(frmForm.imgDateStatu t,
document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

The command document.getElementById("txtDateStatut") don't working in edit
mode.
Tried frmForm.txtDateStatut but don't working also.

Please help me...

Thanks

Jul 21 '05 #2

P: n/a
oops, trying to get it by classname is not the only workaround, that was a
typo error ;P

see the code for the other work around i think should work for you ;)
"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:Du******************@news.edisontel.com...
hi Gilles,
the controls ID is not what you think it is --its a child control --the
datagrid autogenerates a unique id for this. Try to get it by classname
whereas to by ID is the only workaround i can think off the top of my head
;P

See the controls ID in the viewsource after running the page to test if this is the case ;)

if this is the case you could work around it like this :

Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dataGridManufacturer.ItemDataBound
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus = CType(e.Item.Cells(0).FindControl("txtDateStatus") , TextBox)
HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"),
HyperLink)
DateStatus.ID
hyperlink1.NavigateUrl =
"javascript:showCalendar(frmForm.imgDernieresResol utions,
document.getElementById(""" & Datestatus.ID & """), ""yyyy-mm-dd"","""",1)" End If
End Sub
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></asp:HyperLink>
</EditItemTemplate>
</asp:TemplateColumn>
Ok, thats what i would do, however know that i have not tested this
code --but you do get the idea ;)
and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox) looks in cell zero on my code --look to see on which cell you have the textbox and link button and then use the findcontrol there ;P

"Gilles T." <gi************@hotmail.com> wrote in message
news:Vk*********************@news.easynews.com...
How I can get element ID in the edit mode of datagrid control?

If I not in the edit mode, there are no problem.
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a href='javascript:showCalendar(frmForm.imgDateStatu t,
document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

The command document.getElementById("txtDateStatut") don't working in edit mode.
Tried frmForm.txtDateStatut but don't working also.

Please help me...

Thanks


Jul 21 '05 #3

P: n/a
Hi Alessandro,

Thanks you for your response. Now, I think understand but not working again.
This is my new codes:
Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As
System.Web.UI.WebControls.DataGridItemEventArgs)
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =
CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
HyperLink1 =
CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
hyperlink1.NavigateUrl
="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen
tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
End If
End Sub

<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></asp:HyperLink>

And there is the source generated:
<input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut " type="text"
value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut"
class="edit_item" style="width:80px;" />
<a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"
href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl
ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img src="images/cal.gif"
name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>

I have again document.getElementById('txtDateStatut') in the code!
What do you think?
Can you help me again?

Gilles T.
"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:Du******************@news.edisontel.com...
hi Gilles,
the controls ID is not what you think it is --its a child control --the
datagrid autogenerates a unique id for this. Try to get it by classname
whereas to by ID is the only workaround i can think off the top of my head
;P

See the controls ID in the viewsource after running the page to test if this is the case ;)

if this is the case you could work around it like this :

Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dataGridManufacturer.ItemDataBound
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus = CType(e.Item.Cells(0).FindControl("txtDateStatus") , TextBox)
HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"),
HyperLink)
DateStatus.ID
hyperlink1.NavigateUrl =
"javascript:showCalendar(frmForm.imgDernieresResol utions,
document.getElementById(""" & Datestatus.ID & """), ""yyyy-mm-dd"","""",1)" End If
End Sub
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></asp:HyperLink>
</EditItemTemplate>
</asp:TemplateColumn>
Ok, thats what i would do, however know that i have not tested this
code --but you do get the idea ;)
and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox) looks in cell zero on my code --look to see on which cell you have the textbox and link button and then use the findcontrol there ;P

"Gilles T." <gi************@hotmail.com> wrote in message
news:Vk*********************@news.easynews.com...
How I can get element ID in the edit mode of datagrid control?

If I not in the edit mode, there are no problem.
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a href='javascript:showCalendar(frmForm.imgDateStatu t,
document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

The command document.getElementById("txtDateStatut") don't working in edit mode.
Tried frmForm.txtDateStatut but don't working also.

Please help me...

Thanks


Jul 21 '05 #4

P: n/a
my apologies Gilles. I posted that too quickly. I should have known better.
You cannot rely on the controlID generated by the container for child
controls.
Here :

http://msdn.microsoft.com/library/de...tification.asp
But what we can do is get this on the client after it is rendered.

Note this is the only way to do what you want and the easiest. I wrote a
small utlity funtion in javascript. what it does is get a reference to the
parent <tr> table row and then retrieve a collection of all textboxes in
that particular row. To find the correct textbox it then retrieves that
textbox with a css class name matching a particular class . So make sure you
suppy a specific class for your txtDateStatut textbox control. Make sure
this particular textbox is the only textbox with this classname in that row
;P
This is the only requirement --shouldnt be a problem. I have tested this and
it should work like a charm, crossbrowser ;)
for it to work :

<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="dateStatus" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == 'dateStatus'){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>

"Gilles T." <gi************@hotmail.com> wrote in message
news:gs*********************@news.easynews.com...
Hi Alessandro,

Thanks you for your response. Now, I think understand but not working again. This is my new codes:
Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As
System.Web.UI.WebControls.DataGridItemEventArgs)
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =
CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
HyperLink1 =
CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
hyperlink1.NavigateUrl
="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
End If
End Sub

<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></asp:HyperLink>

And there is the source generated:
<input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut " type="text" value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut"
class="edit_item" style="width:80px;" />
<a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"
href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img src="images/cal.gif"
name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>

I have again document.getElementById('txtDateStatut') in the code!
What do you think?
Can you help me again?

Gilles T.
"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:Du******************@news.edisontel.com...
hi Gilles,
the controls ID is not what you think it is --its a child control --the
datagrid autogenerates a unique id for this. Try to get it by classname
whereas to by ID is the only workaround i can think off the top of my head
;P

See the controls ID in the viewsource after running the page to test if

this
is the case ;)

if this is the case you could work around it like this :

Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object,

ByVal
e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dataGridManufacturer.ItemDataBound
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =

CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox)
HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"),
HyperLink)
DateStatus.ID
hyperlink1.NavigateUrl =
"javascript:showCalendar(frmForm.imgDernieresResol utions,
document.getElementById(""" & Datestatus.ID & """),

""yyyy-mm-dd"","""",1)"
End If
End Sub
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></asp:HyperLink>
</EditItemTemplate>
</asp:TemplateColumn>
Ok, thats what i would do, however know that i have not tested this
code --but you do get the idea ;)
and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox) looks in cell zero on my code --look to see on which cell you

have
the textbox and link button and then use the findcontrol there ;P

"Gilles T." <gi************@hotmail.com> wrote in message
news:Vk*********************@news.easynews.com...
How I can get element ID in the edit mode of datagrid control?

If I not in the edit mode, there are no problem.
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %>'/>
<a href='javascript:showCalendar(frmForm.imgDateStatu t,
document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

The command document.getElementById("txtDateStatut") don't working in

edit mode.
Tried frmForm.txtDateStatut but don't working also.

Please help me...

Thanks



Jul 21 '05 #5

P: n/a
Hi Alessandro!

Wow! Working very good! Good javascript sub!

But only a little small problem. In edit mode, <EditItemTemplate>, I have a
specific class for all textbox (color, etc...).
I don't can create a new class properties for each textbox date because I
have many textbox date.
Where I can set my class "edit_item"?

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:bo******************@news.edisontel.com...
my apologies Gilles. I posted that too quickly. I should have known better. You cannot rely on the controlID generated by the container for child
controls.
Here :

http://msdn.microsoft.com/library/de...tification.asp But what we can do is get this on the client after it is rendered.

Note this is the only way to do what you want and the easiest. I wrote a
small utlity funtion in javascript. what it does is get a reference to the
parent <tr> table row and then retrieve a collection of all textboxes in
that particular row. To find the correct textbox it then retrieves that
textbox with a css class name matching a particular class . So make sure you suppy a specific class for your txtDateStatut textbox control. Make sure
this particular textbox is the only textbox with this classname in that row ;P
This is the only requirement --shouldnt be a problem. I have tested this and it should work like a charm, crossbrowser ;)
for it to work :

<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="dateStatus" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == 'dateStatus'){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>

"Gilles T." <gi************@hotmail.com> wrote in message
news:gs*********************@news.easynews.com...
Hi Alessandro,

Thanks you for your response. Now, I think understand but not working

again.
This is my new codes:
Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As
System.Web.UI.WebControls.DataGridItemEventArgs)
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =
CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
HyperLink1 =
CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
hyperlink1.NavigateUrl

="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen
tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
End If
End Sub

<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></asp:HyperLink>

And there is the source generated:
<input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut "

type="text"
value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut"
class="edit_item" style="width:80px;" />
<a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"

href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl
ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img src="images/cal.gif"
name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>
I have again document.getElementById('txtDateStatut') in the code!
What do you think?
Can you help me again?

Gilles T.
"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:Du******************@news.edisontel.com...
hi Gilles,
the controls ID is not what you think it is --its a child control --the datagrid autogenerates a unique id for this. Try to get it by classname whereas to by ID is the only workaround i can think off the top of my head ;P

See the controls ID in the viewsource after running the page to test if this
is the case ;)

if this is the case you could work around it like this :

Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object,

ByVal
e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dataGridManufacturer.ItemDataBound
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =

CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox)
HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"),
HyperLink)
DateStatus.ID
hyperlink1.NavigateUrl =
"javascript:showCalendar(frmForm.imgDernieresResol utions,
document.getElementById(""" & Datestatus.ID & """),

""yyyy-mm-dd"","""",1)"
End If
End Sub
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></asp:HyperLink>
</EditItemTemplate>
</asp:TemplateColumn>
Ok, thats what i would do, however know that i have not tested this
code --but you do get the idea ;)
and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
TextBox) looks in cell zero on my code --look to see on which cell you

have
the textbox and link button and then use the findcontrol there ;P

"Gilles T." <gi************@hotmail.com> wrote in message
news:Vk*********************@news.easynews.com...
> How I can get element ID in the edit mode of datagrid control?
>
> If I not in the edit mode, there are no problem.
> <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
> <ItemTemplate><%#
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %></ItemTemplate>
> <EditItemTemplate>
> <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > runat="server" Text='<%#
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %>'/>
> <a href='javascript:showCalendar(frmForm.imgDateStatu t,
> document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
> src="images/cal.gif" name="imgDateStatut" width="16" height="16"
border="0"
> align="middle"></a>
> </EditItemTemplate>
> </asp:TemplateColumn>
>
> The command document.getElementById("txtDateStatut") don't working

in edit
> mode.
> Tried frmForm.txtDateStatut but don't working also.
>
> Please help me...
>
> Thanks
>
>



Jul 21 '05 #6

P: n/a
Gilles, on the code i posted last, its looking for textboxes with className
of "dateStatus", you could have changed this to whatever className you
wanted to use in the javascript itself, however to simplify, now you can
pass a className string to the getTextBox sub, eliminating the one calender
popup for each textBox per row limit.. In the code sample below i'm passing
"edit_item" as the className to use --you should be able to pass any
className in this way. If you had more textboxes for whom you wanted to
popup your calender you can do so, by specifying a different
className ---Just make sure that in this row and not the whole grid in
itself, but just row --the className must be unique --otherwise it will
return the first textBox that matches this className. This is the second
change i made.
Glad you like it Gille :)
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode,'ed it_item');"
href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow,textBoxClassName){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == textBoxClassName){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
return;
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>
"Gilles T." <gi************@hotmail.com> wrote in message
news:_5*********************@news.easynews.com...
Hi Alessandro!

Wow! Working very good! Good javascript sub!

But only a little small problem. In edit mode, <EditItemTemplate>, I have a specific class for all textbox (color, etc...).
I don't can create a new class properties for each textbox date because I
have many textbox date.
Where I can set my class "edit_item"?

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:bo******************@news.edisontel.com...
my apologies Gilles. I posted that too quickly. I should have known

better.
You cannot rely on the controlID generated by the container for child
controls.
Here :

http://msdn.microsoft.com/library/de...tification.asp
But what we can do is get this on the client after it is rendered.

Note this is the only way to do what you want and the easiest. I wrote a
small utlity funtion in javascript. what it does is get a reference to the
parent <tr> table row and then retrieve a collection of all textboxes in
that particular row. To find the correct textbox it then retrieves that
textbox with a css class name matching a particular class . So make sure

you
suppy a specific class for your txtDateStatut textbox control. Make sure
this particular textbox is the only textbox with this classname in that

row
;P
This is the only requirement --shouldnt be a problem. I have tested this

and
it should work like a charm, crossbrowser ;)
for it to work :

<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="dateStatus" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == 'dateStatus'){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>

"Gilles T." <gi************@hotmail.com> wrote in message
news:gs*********************@news.easynews.com...
Hi Alessandro,

Thanks you for your response. Now, I think understand but not working

again.
This is my new codes:
Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As
System.Web.UI.WebControls.DataGridItemEventArgs)
Dim DateStatus As TextBox
Dim HyperLink1 as HyperLink
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
DateStatus =
CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
HyperLink1 =
CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
hyperlink1.NavigateUrl

="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen
tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
End If
End Sub

<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %>'/>
<asp:HyperLink id="linkShowDate" runat="server"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></asp:HyperLink>

And there is the source generated:
<input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut "

type="text"
value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut"
class="edit_item" style="width:80px;" />
<a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"

href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl
ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>
I have again document.getElementById('txtDateStatut') in the code!
What do you think?
Can you help me again?

Gilles T.
"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in message news:Du******************@news.edisontel.com...
> hi Gilles,
> the controls ID is not what you think it is --its a child control --the > datagrid autogenerates a unique id for this. Try to get it by classname > whereas to by ID is the only workaround i can think off the top of my
head
> ;P
>
> See the controls ID in the viewsource after running the page to test if this
> is the case ;)
>
> if this is the case you could work around it like this :
>
> Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As
Object, ByVal
> e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
> dataGridManufacturer.ItemDataBound
> Dim DateStatus As TextBox
> Dim HyperLink1 as HyperLink
> If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
> ListItemType.AlternatingItem Then
> DateStatus =
CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
> TextBox)
> HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"), > HyperLink)
> DateStatus.ID
> hyperlink1.NavigateUrl =
> "javascript:showCalendar(frmForm.imgDernieresResol utions,
> document.getElementById(""" & Datestatus.ID & """),
""yyyy-mm-dd"","""",1)"
> End If
> End Sub
>
>
> <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
> <ItemTemplate><%#
>

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %></ItemTemplate>
> <EditItemTemplate>
> <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > runat="server" Text='<%#
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %>'/>
> <asp:HyperLink id="linkShowDate" runat="server"><img
> src="images/cal.gif" name="imgDateStatut" width="16" height="16"
border="0"
> align="middle"></asp:HyperLink>
> </EditItemTemplate>
> </asp:TemplateColumn>
>
>
> Ok, thats what i would do, however know that i have not tested this
> code --but you do get the idea ;)
> and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") , > TextBox) looks in cell zero on my code --look to see on which cell you have
> the textbox and link button and then use the findcontrol there ;P
>
>
>
>
>
> "Gilles T." <gi************@hotmail.com> wrote in message
> news:Vk*********************@news.easynews.com...
> > How I can get element ID in the edit mode of datagrid control?
> >
> > If I not in the edit mode, there are no problem.
> > <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> > ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
> > <ItemTemplate><%#
> >

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
> > %></ItemTemplate>
> > <EditItemTemplate>
> > <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > > runat="server" Text='<%#
> >

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
> > %>'/>
> > <a href='javascript:showCalendar(frmForm.imgDateStatu t,
> > document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img
> > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
> border="0"
> > align="middle"></a>
> > </EditItemTemplate>
> > </asp:TemplateColumn>
> >
> > The command document.getElementById("txtDateStatut") don't working in edit
> > mode.
> > Tried frmForm.txtDateStatut but don't working also.
> >
> > Please help me...
> >
> > Thanks
> >
> >
>
>



Jul 21 '05 #7

P: n/a
Hi Alessandro!

That's Ok for Class name but last think.

<asp:TextBox width="80" CssClass="date_Status" id="txtDateStatut1"
runat="server" />
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut1" width="16" height="16" border="0"
align="middle"></a>

<asp:TextBox width="80" CssClass="date_Status" id="txtDateStatut2"
runat="server" />
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut2" width="16" height="16" border="0"
align="middle"></a>

Can you help me to passing the image name for using in Javascript function?
showCalendar(Must be image name,childTextBoxItem, "yyyy-mm-dd","",1);

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:4b*******************@news.edisontel.com...
Gilles, on the code i posted last, its looking for textboxes with className of "dateStatus", you could have changed this to whatever className you
wanted to use in the javascript itself, however to simplify, now you can
pass a className string to the getTextBox sub, eliminating the one calender popup for each textBox per row limit.. In the code sample below i'm passing "edit_item" as the className to use --you should be able to pass any
className in this way. If you had more textboxes for whom you wanted to
popup your calender you can do so, by specifying a different
className ---Just make sure that in this row and not the whole grid in
itself, but just row --the className must be unique --otherwise it will
return the first textBox that matches this className. This is the second
change i made.
Glad you like it Gille :)
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode,'ed it_item');"
href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0" align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow,textBoxClassName){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == textBoxClassName){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
return;
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>
"Gilles T." <gi************@hotmail.com> wrote in message
news:_5*********************@news.easynews.com...
Hi Alessandro!

Wow! Working very good! Good javascript sub!

But only a little small problem. In edit mode, <EditItemTemplate>, I have
a
specific class for all textbox (color, etc...).
I don't can create a new class properties for each textbox date because I have many textbox date.
Where I can set my class "edit_item"?

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:bo******************@news.edisontel.com...
my apologies Gilles. I posted that too quickly. I should have known

better.
You cannot rely on the controlID generated by the container for child
controls.
Here :

http://msdn.microsoft.com/library/de...tification.asp
But what we can do is get this on the client after it is rendered.

Note this is the only way to do what you want and the easiest. I wrote a small utlity funtion in javascript. what it does is get a reference to the parent <tr> table row and then retrieve a collection of all textboxes in that particular row. To find the correct textbox it then retrieves that textbox with a css class name matching a particular class . So make sure
you
suppy a specific class for your txtDateStatut textbox control. Make
sure this particular textbox is the only textbox with this classname in that
row
;P
This is the only requirement --shouldnt be a problem. I have tested
this and
it should work like a charm, crossbrowser ;)
for it to work :

<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="dateStatus" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") %>'/>
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == 'dateStatus'){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1); }//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>

"Gilles T." <gi************@hotmail.com> wrote in message
news:gs*********************@news.easynews.com...
> Hi Alessandro,
>
> Thanks you for your response. Now, I think understand but not working again.
> This is my new codes:
> Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As > System.Web.UI.WebControls.DataGridItemEventArgs)
> Dim DateStatus As TextBox
> Dim HyperLink1 as HyperLink
> If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
> ListItemType.AlternatingItem Then
> DateStatus =
> CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
> HyperLink1 =
> CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
> hyperlink1.NavigateUrl
>

="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen
> tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
> End If
> End Sub
>
> <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > runat="server" Text='<%#
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %>'/>
> <asp:HyperLink id="linkShowDate" runat="server"><img
> src="images/cal.gif" name="imgDateStatut" width="16" height="16"
border="0"
> align="middle"></asp:HyperLink>
>
> And there is the source generated:
> <input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut "
type="text"
> value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut"
> class="edit_item" style="width:80px;" />
> <a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"
>

href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl
> ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img

src="images/cal.gif"
> name="imgDateStatut" width="16" height="16" border="0"

align="middle"></a>
>
> I have again document.getElementById('txtDateStatut') in the code!
> What do you think?
> Can you help me again?
>
> Gilles T.
>
>
> "Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in > message news:Du******************@news.edisontel.com...
> > hi Gilles,
> > the controls ID is not what you think it is --its a child

control --the
> > datagrid autogenerates a unique id for this. Try to get it by

classname
> > whereas to by ID is the only workaround i can think off the top of my head
> > ;P
> >
> > See the controls ID in the viewsource after running the page to test if
> this
> > is the case ;)
> >
> > if this is the case you could work around it like this :
> >
> > Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As Object, > ByVal
> > e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
> > dataGridManufacturer.ItemDataBound
> > Dim DateStatus As TextBox
> > Dim HyperLink1 as HyperLink
> > If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType
= > > ListItemType.AlternatingItem Then
> > DateStatus =
> CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
> > TextBox)
> > HyperLink1 = = CType(e.Item.Cells(0).FindControl("linkShowDate"), > > HyperLink)
> > DateStatus.ID
> > hyperlink1.NavigateUrl =
> > "javascript:showCalendar(frmForm.imgDernieresResol utions,
> > document.getElementById(""" & Datestatus.ID & """),
> ""yyyy-mm-dd"","""",1)"
> > End If
> > End Sub
> >
> >
> > <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> > ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
> > <ItemTemplate><%#
> >

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
> > %></ItemTemplate>
> > <EditItemTemplate>
> > <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > > runat="server" Text='<%#
> >

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
> > %>'/>
> > <asp:HyperLink id="linkShowDate" runat="server"><img
> > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
> border="0"
> > align="middle"></asp:HyperLink>
> > </EditItemTemplate>
> > </asp:TemplateColumn>
> >
> >
> > Ok, thats what i would do, however know that i have not tested this > > code --but you do get the idea ;)
> > and also not that CType(e.Item.Cells(0).FindControl("txtDateStatus") , > > TextBox) looks in cell zero on my code --look to see on which cell you > have
> > the textbox and link button and then use the findcontrol there ;P
> >
> >
> >
> >
> >
> > "Gilles T." <gi************@hotmail.com> wrote in message
> > news:Vk*********************@news.easynews.com...
> > > How I can get element ID in the edit mode of datagrid control?
> > >
> > > If I not in the edit mode, there are no problem.
> > > <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> > > ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top"> > > > <ItemTemplate><%#
> > >
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > %></ItemTemplate>
> > > <EditItemTemplate>
> > > <asp:TextBox width="80" CssClass="edit_item"

id="txtDateStatut"
> > > runat="server" Text='<%#
> > >
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > %>'/>
> > > <a href='javascript:showCalendar(frmForm.imgDateStatu t,
> > > document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img > > > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
> > border="0"
> > > align="middle"></a>
> > > </EditItemTemplate>
> > > </asp:TemplateColumn>
> > >
> > > The command document.getElementById("txtDateStatut") don't

working in
> edit
> > > mode.
> > > Tried frmForm.txtDateStatut but don't working also.
> > >
> > > Please help me...
> > >
> > > Thanks
> > >
> > >
> >
> >
>
>



Jul 21 '05 #8

P: n/a
oops, yeah forgot. Totally slipped my mind ;)
always building onto the last code i posted, i'm passing the image too as
this.lastChild --

<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a
onclick="getTextBox(this.lastChild,this.parentNode .parentNode,'edit_item');"
href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16" border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

<script type="text/javascript">
//<![CDATA[

function getTextBox(imageElm,currentRow,textBoxClassName){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == textBoxClassName){
//alert(childTextBoxItem.id);
showCalendar(imageElm,childTextBoxItem, "yyyy-mm-dd","",1);
return;
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>

"Gilles T." <gi************@hotmail.com> wrote in message
news:i8*********************@news.easynews.com...
Hi Alessandro!

That's Ok for Class name but last think.

<asp:TextBox width="80" CssClass="date_Status" id="txtDateStatut1"
runat="server" />
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut1" width="16" height="16" border="0" align="middle"></a>

<asp:TextBox width="80" CssClass="date_Status" id="txtDateStatut2"
runat="server" />
<a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img
src="images/cal.gif" name="imgDateStatut2" width="16" height="16" border="0" align="middle"></a>

Can you help me to passing the image name for using in Javascript function? showCalendar(Must be image name,childTextBoxItem, "yyyy-mm-dd","",1);

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
message news:4b*******************@news.edisontel.com...
Gilles, on the code i posted last, its looking for textboxes with className
of "dateStatus", you could have changed this to whatever className you
wanted to use in the javascript itself, however to simplify, now you can
pass a className string to the getTextBox sub, eliminating the one

calender
popup for each textBox per row limit.. In the code sample below i'm

passing
"edit_item" as the className to use --you should be able to pass any
className in this way. If you had more textboxes for whom you wanted to
popup your calender you can do so, by specifying a different
className ---Just make sure that in this row and not the whole grid in
itself, but just row --the className must be unique --otherwise it will
return the first textBox that matches this className. This is the second
change i made.
Glad you like it Gille :)
<asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
<ItemTemplate><%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%></ItemTemplate>
<EditItemTemplate>
<asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut"
runat="server" Text='<%#
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
%>'/>
<a onclick="getTextBox(this.parentNode.parentNode,'ed it_item');"
href="#"><img
src="images/cal.gif" name="imgDateStatut" width="16" height="16"

border="0"
align="middle"></a>
</EditItemTemplate>
</asp:TemplateColumn>

somewhere in your page add this javascript block, after retrieving the
correct textbox it calls your showCalender Function

<script type="text/javascript">
//<![CDATA[

function getTextBox(currentRow,textBoxClassName){
var i;
var childrenTextBoxes = currentRow.getElementsByTagName("input");
for (i = 0; i < childrenTextBoxes.length; i ++){
var childTextBoxItem = childrenTextBoxes[i];
childTextBoxItem = childrenTextBoxes[i];
if (childTextBoxItem.className == textBoxClassName){
//alert(childTextBoxItem.id);
showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1);
return;
}//childTextBoxItem statement End
}//childrenTextBoxes for Loop End
}//getTextBox
//]]>
</script>
"Gilles T." <gi************@hotmail.com> wrote in message
news:_5*********************@news.easynews.com...
Hi Alessandro!

Wow! Working very good! Good javascript sub!

But only a little small problem. In edit mode, <EditItemTemplate>, I have
a
specific class for all textbox (color, etc...).
I don't can create a new class properties for each textbox date because I have many textbox date.
Where I can set my class "edit_item"?

Thanks

"Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote
in message news:bo******************@news.edisontel.com...
> my apologies Gilles. I posted that too quickly. I should have known
better.
> You cannot rely on the controlID generated by the container for child > controls.
> Here :
>
>

http://msdn.microsoft.com/library/de...tification.asp
> But what we can do is get this on the client after it is rendered.
>
> Note this is the only way to do what you want and the easiest. I wrote a
> small utlity funtion in javascript. what it does is get a reference
to
the
> parent <tr> table row and then retrieve a collection of all
textboxes
in > that particular row. To find the correct textbox it then retrieves that > textbox with a css class name matching a particular class . So make sure you
> suppy a specific class for your txtDateStatut textbox control. Make sure > this particular textbox is the only textbox with this classname in that row
> ;P
> This is the only requirement --shouldnt be a problem. I have tested this and
> it should work like a charm, crossbrowser ;)
> for it to work :
>
> <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> ItemStyle-HorizontalAlign="center" ItemStyle-VerticalAlign="top">
> <ItemTemplate><%#
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %></ItemTemplate>
> <EditItemTemplate>
> <asp:TextBox width="80" CssClass="dateStatus"
id="txtDateStatut" > runat="server" Text='<%#
>
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > %>'/>
> <a onclick="getTextBox(this.parentNode.parentNode);" href="#"><img > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
border="0"
> align="middle"></a>
> </EditItemTemplate>
> </asp:TemplateColumn>
>
> somewhere in your page add this javascript block, after retrieving the > correct textbox it calls your showCalender Function
>
> <script type="text/javascript">
> //<![CDATA[
>
> function getTextBox(currentRow){
> var i;
> var childrenTextBoxes = currentRow.getElementsByTagName("input");
> for (i = 0; i < childrenTextBoxes.length; i ++){
> var childTextBoxItem = childrenTextBoxes[i];
> childTextBoxItem = childrenTextBoxes[i];
> if (childTextBoxItem.className == 'dateStatus'){
> //alert(childTextBoxItem.id);
> showCalendar(frmForm.imgDateStatut,childTextBoxIte m, "yyyy-mm-dd","",1); > }//childTextBoxItem statement End
> }//childrenTextBoxes for Loop End
> }//getTextBox
> //]]>
> </script>
>
>
>
>
>
> "Gilles T." <gi************@hotmail.com> wrote in message
> news:gs*********************@news.easynews.com...
> > Hi Alessandro,
> >
> > Thanks you for your response. Now, I think understand but not working > again.
> > This is my new codes:
> > Private Sub dataGridManufacturer_ItemDataBound(sender As Object, e As
> > System.Web.UI.WebControls.DataGridItemEventArgs)
> > Dim DateStatus As TextBox
> > Dim HyperLink1 as HyperLink
> > If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType
= > > ListItemType.AlternatingItem Then
> > DateStatus =
> > CType(e.Item.Cells(0).FindControl("txtDateStatut") ,TextBox)
> > HyperLink1 =
> > CType(e.Item.Cells(0).FindControl("linkShowDate"), HyperLink)
> > hyperlink1.NavigateUrl
> >
>

="javascript:showCalendar(frmForm.imgDernieresReso lutions,document.getElemen
> > tById('" & Datestatus.ID & "'), 'yyyy-mm-dd','',1)"
> > End If
> > End Sub
> >
> > <asp:TextBox width="80" CssClass="edit_item" id="txtDateStatut" > > runat="server" Text='<%#
> >

CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd")
> > %>'/>
> > <asp:HyperLink id="linkShowDate" runat="server"><img
> > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
> border="0"
> > align="middle"></asp:HyperLink>
> >
> > And there is the source generated:
> > <input name="_ctl0:grdCompagnieStatut:_ctl4:txtDateStatut "
> type="text"
> > value="2003-02-01" id="_ctl0_grdCompagnieStatut__ctl4_txtDateStatut" > > class="edit_item" style="width:80px;" />
> > <a id="_ctl0_grdCompagnieStatut__ctl4_linkShowDate"
> >
>

href="javascript:showCalendar(frmForm.imgDernieres Resolutions,document.getEl
> > ementById('txtDateStatut'), 'yyyy-mm-dd','',1)"><img
src="images/cal.gif"
> > name="imgDateStatut" width="16" height="16" border="0"
align="middle"></a>
> >
> > I have again document.getElementById('txtDateStatut') in the code!
> > What do you think?
> > Can you help me again?
> >
> > Gilles T.
> >
> >
> > "Alessandro Zifiglio" <al****************@NO-SPAM-hotmail.com> wrote in
> > message news:Du******************@news.edisontel.com...
> > > hi Gilles,
> > > the controls ID is not what you think it is --its a child
control --the
> > > datagrid autogenerates a unique id for this. Try to get it by
classname
> > > whereas to by ID is the only workaround i can think off the top
of
my
> head
> > > ;P
> > >
> > > See the controls ID in the viewsource after running the page to test if
> > this
> > > is the case ;)
> > >
> > > if this is the case you could work around it like this :
> > >
> > > Private Sub dataGridManufacturer_ItemDataBound(ByVal sender As

Object,
> > ByVal
> > > e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles
> > > dataGridManufacturer.ItemDataBound
> > > Dim DateStatus As TextBox
> > > Dim HyperLink1 as HyperLink
> > > If e.Item.ItemType = ListItemType.Item Or
e.Item.ItemType = > > > ListItemType.AlternatingItem Then
> > > DateStatus =
> > CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
> > > TextBox)
> > > HyperLink1 = =

CType(e.Item.Cells(0).FindControl("linkShowDate"),
> > > HyperLink)
> > > DateStatus.ID
> > > hyperlink1.NavigateUrl =
> > > "javascript:showCalendar(frmForm.imgDernieresResol utions,
> > > document.getElementById(""" & Datestatus.ID & """),
> > ""yyyy-mm-dd"","""",1)"
> > > End If
> > > End Sub
> > >
> > >
> > > <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3"
> > > ItemStyle-HorizontalAlign="center"
ItemStyle-VerticalAlign="top"> > > > <ItemTemplate><%#
> > >
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > %></ItemTemplate>
> > > <EditItemTemplate>
> > > <asp:TextBox width="80" CssClass="edit_item"

id="txtDateStatut"
> > > runat="server" Text='<%#
> > >
CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > %>'/>
> > > <asp:HyperLink id="linkShowDate" runat="server"><img
> > > src="images/cal.gif" name="imgDateStatut" width="16" height="16"
> > border="0"
> > > align="middle"></asp:HyperLink>
> > > </EditItemTemplate>
> > > </asp:TemplateColumn>
> > >
> > >
> > > Ok, thats what i would do, however know that i have not tested

this > > > code --but you do get the idea ;)
> > > and also not that

CType(e.Item.Cells(0).FindControl("txtDateStatus") ,
> > > TextBox) looks in cell zero on my code --look to see on which cell you
> > have
> > > the textbox and link button and then use the findcontrol there
;P > > >
> > >
> > >
> > >
> > >
> > > "Gilles T." <gi************@hotmail.com> wrote in message
> > > news:Vk*********************@news.easynews.com...
> > > > How I can get element ID in the edit mode of datagrid control?
> > > >
> > > > If I not in the edit mode, there are no problem.
> > > > <asp:TemplateColumn ItemStyle-CssClass="grid_column_width_3" > > > > ItemStyle-HorizontalAlign="center"

ItemStyle-VerticalAlign="top"> > > > > <ItemTemplate><%#
> > > >
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > > %></ItemTemplate>
> > > > <EditItemTemplate>
> > > > <asp:TextBox width="80" CssClass="edit_item"
id="txtDateStatut"
> > > > runat="server" Text='<%#
> > > >
> CType(Container.DataItem("DateStatut"),DateTime).T oString("yyyy-MM-dd") > > > > %>'/>
> > > > <a href='javascript:showCalendar(frmForm.imgDateStatu t,
> > > > document.getElementById("txtDateStatut"), "yyyy-mm-dd","",1)'><img > > > > src="images/cal.gif" name="imgDateStatut" width="16" height="16" > > > border="0"
> > > > align="middle"></a>
> > > > </EditItemTemplate>
> > > > </asp:TemplateColumn>
> > > >
> > > > The command document.getElementById("txtDateStatut") don't working in
> > edit
> > > > mode.
> > > > Tried frmForm.txtDateStatut but don't working also.
> > > >
> > > > Please help me...
> > > >
> > > > Thanks
> > > >
> > > >
> > >
> > >
> >
> >
>
>



Jul 21 '05 #9

This discussion thread is closed

Replies have been disabled for this discussion.