Show hide div using codebehind

Question

i have dropdowlist for which iam trying to show a div OnSelectedIndexChanged but it says OBJECT REQUIRED..

iam binding the datalist in that div

here is my code

aspx

   <asp:DropDownList runat="server" ID="lstFilePrefix1" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" >
                            <asp:ListItem Text="Prefix1" Value="Prefix1" />
                            <asp:ListItem Text="Prefix2" Value="Prefix2" />
                            <asp:ListItem Text="Prefix3" Value="Prefix3" />
                            <asp:ListItem Text="Prefix1 and Prefix2" Value="Prefix1 and Prefix2" />
                            <asp:ListItem Text="Prefix2 and Prefix3" Value="Prefix2 and Prefix3" />
                            </asp:DropDownList>
:
:
:
<div id="data" class="divdata"   style="display:none">                                    


                <asp:DataList ID="DataList1" runat="server" RepeatColumns = "4"  
                        CssClass="datalist1"  OnItemDataBound="SOMENAMEItemBound"
                CellSpacing="6" onselectedindexchanged="DataList1_SelectedIndexChanged" 
                        HorizontalAlign="Center" Width="500px">

:
:
:

codebehind

 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (lstFilePrefix1.SelectedItem.Text=="Prefix2")
            {
                int TotalRows = this.BindList(1);
                this.Prepare_Pager(TotalRows);
               Page.ClientScript.RegisterClientScriptBlock(GetType(), "JScript1", "ShowDiv('data');", true);

            }

        }

and here is javascript in .js file

function ShowDiv(obj)
 {
 var dataDiv = document.getElementById(obj);
 dataDiv.style.display = "block";

 }

what ami doing wrong??plz help

Answer 1

RegisteredClientScriptBlock adds the script at the top of the page on the post-back with no assurance about the order, meaning that either the call is being injected after the function declaration (your js file with the function is inlined after your call) or when the script tries to execute the div is probably not there yet 'cause the page is still rendering. A good idea is probably to simulate the two scenarios I described above on firebug and see if you get similar errors.

My guess is this would work if you append the script at the bottom of the page with RegisterStartupScript - worth a shot at least.

Anyway, as an alternative solution if you add the runat="server" attribute to the div you will be able to access it by its id in the codebehind (without reverting to js - how cool that might be), and make it disappear like this:

data.visible = false

Answer 2

There's a lot of ways to do this. I don't really see a real reason to use both server and client side code, however.

Make the div runat="server" and do

   if (lstFilePrefix1.SelectedValue=="Prefix2")
            {
                int TotalRows = this.BindList(1);
                this.Prepare_Pager(TotalRows);
                data.Style["display"] = "block";

            }

Your method isn't working because the javascript is being rendered in the top of the body tag, before the div is rendered. You'd have to include code to tell the javascript to wait for the DOM to be completely ready to take on your request, which would probably be easiest to do with jQuery.

Answer 3

You can use a standard ASP.NET Panel and then set it's visible property in your code behind.

<asp:Panel ID="Panel1" runat="server" visible="false" />

To show panel in codebehind:

Panel1.Visible = true;