CODEWITHSUNDEEP
javascriptasp.net
Troy Mitchel
Troy Mitchel

Reputation: 1810

Pass Multiple Controls to Javascript Function in WebUserControl

If I have a Web User Conrol (ASP.NET), how do I pass multiple objects to javascript function from the markup? See Below under the image control calling ShowList...

<script type="text/javascript">
function ShowList(txt, lst) {
    var t = document.getElementById(t.id);
    var l = document.getElementById(l.id);
    l.style.display = 'block';
}
</script>

<asp:Panel ID="Wrapper" runat="server" Width="200px">
<asp:TextBox ID="TextBox1" runat="server" Width="150px"></asp:TextBox>
<asp:Image ID="Image1" runat="server" CssClass="image" ImageUrl="~/Images/cb-button-b3.png"
    onclick='<%="ShowList("TextBox1,ListBox1)"%>'>
</asp:Image>
<asp:ListBox ID="ListBox1" runat="server" CssClass="listbox">
    <asp:ListItem>a</asp:ListItem>
    <asp:ListItem>b</asp:ListItem>
    <asp:ListItem>c</asp:ListItem>
</asp:ListBox>
</asp:Panel>

Upvotes: 0

Views: 2680

Answers (1)

Katie Kilian
Katie Kilian

Reputation: 6993

Why do you have the <% and %> in this code snippet?

onclick='<%="ShowList("TextBox1,ListBox1)"%>'

That is telling ASP.NET to process that part on the server side, before it gets to the client. But you are trying to call a javascript function that is supposed run in the web browser on the client side. Also, your double quotes are in the wrong places.

Try changing the above snipped to this instead:

onclick='ShowList(TextBox1,ListBox1)'

The whole line would be this:

<asp:Image ID="Image1" runat="server" CssClass="image" 
    ImageUrl="~/Images/cb-button-b3.png" 
    onclick='ShowList(TextBox1,ListBox1)'></asp:Image>

Also, make sure the control IDs in the HTML generated by ASP.NET match the IDs you assigned on the server. If you're using master pages, they won't. In that case, you need to check what names they are assigned by doing View Source from the web browser and searching for the name. A control's final ID is assigned based on its NamingContainer. The details are a little bit beyond the scope of your question, but the main thing is to make sure the IDs you're using in Javascript (in this case, TextBox1 and ListBox1) match what ASP.NET is actually outputting to the web browser.

Upvotes: 1

Related Questions