Datagrids: Hiding and displaying in same place

[olypost]

Hi,

I would like to have 5 datagrids on the same page in such a way that they are all placed exactly in the same position on the page. Clicking a tab button would display the first datagrid, a second tab button the second datagrid, etc. (ie., show only one datagrid at a time)

How can you hide an entire datagrid, and dynamically display a different one in the same position?

I did a registerstartupscript to set focus to the new datagrid, and for some reason all I get is the column headings of the new datagrid, but the items of the previous datagrid still appear.

page.registerstartupscript("SetFocus","<script language=""Jscript"" >document.getElementById(""DataGrid2"").focus(); </Script>")

What do I need to get this to work? Or is this even possible?

Thanks.

 

[olypost]

I think I solved it: datagrid1.visible = False
datagrid2.visible = True etc.

 

[ca8msm]

You could also do this client side (if you wanted to avoid the trip back to the server to set the Visible property) by toggling the Display style of a div (each div would contain it's own DataGrid) between "block" and "none".


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[wsmall73]

Or using the microsoft tab control... while the support documentation is pretty poor there are a handful of examples out there and again you would skip the post backs.

 

[Isadore]

Another option would be to place the datagrids within Panels; what would be more efficent? To set the datagrid's visible property to False or to to set a Panel's visible property to False?

The question comes to mind that if a particular dg is to be set to Visible=False you would not want to rebind it on a return to the Server.

 

[olypost]

Thanks. I create a div for each datagrid. Then wrote a javascript function that sets the display to either none or block. Works great.

However, I'd also like to bind all the datagrids in the pageload, and have tabs that when clicked calls the function. The problem now is, my 'first' datagrid doesn't completely overlap the other datagrids when the page first loads. When I start clicking the 'tabs', it works great (one and only one dg shows).

Is there a way to get the page to load initially like this? Or do I need to bind only the first dg in pageload?

 

[ca8msm]

Or do I need to bind only the first dg in pageload?

No, you can do it on page load like you have asked. All you need to do is fire the javscript event when the page loads (i.e. the code that fires when you click the relevant tab). You can do this by adding the code in the Page Load event via Page.RegisterStartUpScript


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.