access control in a Repeater from javascript

D

David Thielen

Hi;

Inside a Repeater control I have a Label, TextBox, and DropDownList that I
need to enable/disable based on the value of abother DropDownList. I need to
do this in javascript whenever the 2nd DropDownList changes it's value.

All controls are in the same row of the Repeater. How do I access these
controls in javascript? I have to get the index of the one that changed and
use that to get the other controls in it's row.
 
S

Steven Cheng[MSFT]

Hi Dave,

Thank you for posting.

As for ASP.NET control, if we want to reference and manipulate them in
client-side script code, we should know its client-side ID in the html
document. To get this client-side , we can use the WebControl's ClientID
property. However, we must read it after the certain control has been added
into its parent NamingContainer, otherwise, the ClientID doesn't represent
the actual id that'll be writeout to client html document. Here is a
simple test page which demonstrate on how to use client-side script to
reference sub controls in repeater and use script code to manipulate them:

========aspx==========
<div>
<asp:Repeater ID="Repeater1" runat="server"
OnItemDataBound="Repeater1_ItemDataBound" >
<ItemTemplate>
<br /><hr />
<br />

<asp:DropDownList ID="list1" runat="server">
<asp:ListItem Text="Enable" Value="Enable"></asp:ListItem>
<asp:ListItem Text="Disable" Value="Disable"></asp:ListItem>
</asp:DropDownList>


<asp:DropDownList ID="list2" runat="server">
<asp:ListItem Text="Item1" Value="Item1"></asp:ListItem>
<asp:ListItem Text="Item2" Value="Item2"></asp:ListItem>
<asp:ListItem Text="Item3" Value="Item3"></asp:ListItem>
<asp:ListItem Text="Item4" Value="Item4"></asp:ListItem>
</asp:DropDownList>

</ItemTemplate>
</asp:Repeater>

</div>
============code behind===========


public partial class Repeater_FileList : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DirectoryInfo di = new
DirectoryInfo(Server.MapPath("~/Common/"));
FileInfo[] pages = di.GetFiles("*.aspx");

Repeater1.DataSource = pages;
Repeater1.DataBind();


}

string script = @"
function change_list_status(list1id, list2id)
{
var list1 = document.getElementById(list1id);
var list2 = document.getElementById(list2id);


if(list1.selectedIndex == 0)
{
list2.disabled = false;
}else
{
list2.disabled = true;
}

}
";

Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
"list_function", script,true);


}






protected void Repeater1_ItemDataBound(object sender,
RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
ListItemType.AlternatingItem)
{
DropDownList list1 = e.Item.FindControl("list1") as
DropDownList;
DropDownList list2 = e.Item.FindControl("list2") as
DropDownList;


list1.Attributes["onchange"] = "change_list_status('" +
list1.ClientID + "','" + list2.ClientID + "');";


}
}
}
==============================

Hope this helps.

Regards,

Steven Cheng
Microsoft Online Community Support


==================================================

When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.

==================================================


This posting is provided "AS IS" with no warranties, and confers no rights.



Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
 
D

David Thielen

perfect - THANK YOU

One question - I just put the javascript in my aspx file rather than adding
it in the code behind. Is there any reason to not do that?

--
thanks - dave
david_at_windward_dot_net
http://www.windwardreports.com



Steven Cheng said:
Hi Dave,

Thank you for posting.

As for ASP.NET control, if we want to reference and manipulate them in
client-side script code, we should know its client-side ID in the html
document. To get this client-side , we can use the WebControl's ClientID
property. However, we must read it after the certain control has been added
into its parent NamingContainer, otherwise, the ClientID doesn't represent
the actual id that'll be writeout to client html document. Here is a
simple test page which demonstrate on how to use client-side script to
reference sub controls in repeater and use script code to manipulate them:

========aspx==========
<div>
<asp:Repeater ID="Repeater1" runat="server"
OnItemDataBound="Repeater1_ItemDataBound" >
<ItemTemplate>
<br /><hr />
<br />

<asp:DropDownList ID="list1" runat="server">
<asp:ListItem Text="Enable" Value="Enable"></asp:ListItem>
<asp:ListItem Text="Disable" Value="Disable"></asp:ListItem>
</asp:DropDownList>


<asp:DropDownList ID="list2" runat="server">
<asp:ListItem Text="Item1" Value="Item1"></asp:ListItem>
<asp:ListItem Text="Item2" Value="Item2"></asp:ListItem>
<asp:ListItem Text="Item3" Value="Item3"></asp:ListItem>
<asp:ListItem Text="Item4" Value="Item4"></asp:ListItem>
</asp:DropDownList>

</ItemTemplate>
</asp:Repeater>

</div>
============code behind===========


public partial class Repeater_FileList : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DirectoryInfo di = new
DirectoryInfo(Server.MapPath("~/Common/"));
FileInfo[] pages = di.GetFiles("*.aspx");

Repeater1.DataSource = pages;
Repeater1.DataBind();


}

string script = @"
function change_list_status(list1id, list2id)
{
var list1 = document.getElementById(list1id);
var list2 = document.getElementById(list2id);


if(list1.selectedIndex == 0)
{
list2.disabled = false;
}else
{
list2.disabled = true;
}

}
";

Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
"list_function", script,true);


}






protected void Repeater1_ItemDataBound(object sender,
RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType ==
ListItemType.AlternatingItem)
{
DropDownList list1 = e.Item.FindControl("list1") as
DropDownList;
DropDownList list2 = e.Item.FindControl("list2") as
DropDownList;


list1.Attributes["onchange"] = "change_list_status('" +
list1.ClientID + "','" + list2.ClientID + "');";


}
}
}
==============================

Hope this helps.

Regards,

Steven Cheng
Microsoft Online Community Support


==================================================

When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.

==================================================


This posting is provided "AS IS" with no warranties, and confers no rights.



Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
 
S

Steven Cheng[MSFT]

Thanks for the followup.

Nothing different from usage viewpoint. However, I found some guys like
dynamically emitting such script(since they're specific to a control rather
than the whole page). Also, sometimes, when we developing custom control
and the custom control will use some script specific to itself, we can only
use this code to dynamically emit custom control specific script in
control's code.

Regards,

Steven Cheng
Microsoft Online Community Support


==================================================

When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.

==================================================


This posting is provided "AS IS" with no warranties, and confers no rights.



Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,479
Members
44,899
Latest member
RodneyMcAu

Latest Threads

Top