Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
Classic ASP Professional For advanced coder questions in ASP 3. NOT for ASP.NET 1.0, 1.1, or 2.0.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Classic ASP Professional section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old March 25th, 2004, 05:28 AM
Friend of Wrox
Points: 2,376, Level: 20
Points: 2,376, Level: 20 Points: 2,376, Level: 20 Points: 2,376, Level: 20
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: , , Australia.
Posts: 596
Thanks: 1
Thanked 3 Times in 3 Posts
Default Datagrids and Javascript ASP.NET

I wish to hide and display some data in a column of a datagrid but am not sure how to reference the item I wish to show and hide in javascript

In classic asp I would loop through the records and make up the IDs of the DIV tags and the code to call the javascript on the run. Now ASP.NET will create the IDs for the records and the elements within.

How do I attach some javascript to an element in a datagrid to hide a DIV that is in the same column and row with c# and ASP.NET?

Or MUST I to return to the server?


======================================
They say, best men are moulded out of faults,
And, for the most, become much more the better
For being a little bad.
======================================
__________________
======================================
"They say, best men are molded out of faults,
And, for the most, become much more the better
For being a little bad."
--Shakespeare
======================================
Reply With Quote
  #2 (permalink)  
Old March 29th, 2004, 06:03 PM
planoie's Avatar
Friend of Wrox
Points: 16,481, Level: 55
Points: 16,481, Level: 55 Points: 16,481, Level: 55 Points: 16,481, Level: 55
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Aug 2003
Location: Clifton Park, New York, USA.
Posts: 5,407
Thanks: 0
Thanked 16 Times in 16 Posts
Default

Hey rod.

You can set the "style.display" property in javascript for many objects. That includes table cells as well. From there, you can set the "style.display" property to "none". Conversely, you'll want to set it to "inline" to show the column again.

However, the hard part is getting the right client-side IDs for the cells of the datagrid. I'm not sure how you can go about that if it's even possible.
Reply With Quote
  #3 (permalink)  
Old March 29th, 2004, 09:21 PM
Friend of Wrox
Points: 2,376, Level: 20
Points: 2,376, Level: 20 Points: 2,376, Level: 20 Points: 2,376, Level: 20
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: , , Australia.
Posts: 596
Thanks: 1
Thanked 3 Times in 3 Posts
Default

Thanks Peter,
I was afraid you where going to say that, I'll have to look into the id generation a little more.


======================================
They say, best men are moulded out of faults,
And, for the most, become much more the better
For being a little bad.
======================================
Reply With Quote
  #4 (permalink)  
Old March 30th, 2004, 04:38 AM
Imar's Avatar
Wrox Author
Points: 72,038, Level: 100
Points: 72,038, Level: 100 Points: 72,038, Level: 100 Points: 72,038, Level: 100
Activity: 100%
Activity: 100% Activity: 100% Activity: 100%
 
Join Date: Jun 2003
Location: Utrecht, Netherlands.
Posts: 17,080
Thanks: 80
Thanked 1,587 Times in 1,563 Posts
Default

Hi Rod,

Do you know when the page loads which rows you want to hide? If that's the case, you can add their ClientIDs to a page level array using the RegisterArrayDeclaration method.

This method will dump a JavaScript array to the end of the page, so you could simply loop through that array, hiding or showing the stuff you need.

HtH,

Imar


---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
Reply With Quote
  #5 (permalink)  
Old March 30th, 2004, 04:47 AM
Friend of Wrox
Points: 2,376, Level: 20
Points: 2,376, Level: 20 Points: 2,376, Level: 20 Points: 2,376, Level: 20
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: , , Australia.
Posts: 596
Thanks: 1
Thanked 3 Times in 3 Posts
Default

Imar,
Thanks for that, RegisterArrayDeclaration is new to me so I'll play around with it.
Basically I want the datagrid to only show the a company name and maybe another field or two, then when they click on a view details icon the rest of the company info will show up dynamically below the companies listing.
I was reading a little last night about adding clientside javascript scripts to controls from the server side and was thinking that I may be able to reference the recently generated control ID on the datagrids item created (or similar) event and then build and add the javascript within that context.
As I said this is a bit new to me so I'll give your method a go and let you know how I went.

Thanks again


======================================
They say, best men are moulded out of faults,
And, for the most, become much more the better
For being a little bad.
======================================
Reply With Quote
  #6 (permalink)  
Old April 7th, 2004, 09:25 PM
Friend of Wrox
Points: 2,376, Level: 20
Points: 2,376, Level: 20 Points: 2,376, Level: 20 Points: 2,376, Level: 20
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: , , Australia.
Posts: 596
Thanks: 1
Thanked 3 Times in 3 Posts
Default

Solution Found:

Silly how easy in the end really, after trying many other ways, some of which worked but very messy.

This is an ItemTemplate within my datagrid.
Basically it hides the company info until the link is clicked then it is displayed using client side javascript.The unique div tag id is simply created by appending hte databound id to the tag id.

Code:
            <ItemTemplate>        
                <a onclick="if(document.all['CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>'].style.visibility == 'visible'){document.all['CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>'].style.visibility='hidden';document.all['CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>'].style.display='none';}else{document.all['CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>'].style.visibility='visible';document.all['CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>'].style.display='';}">This is the link</a>
                <div id='CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%>' style='visibility:hidden;display:none'>This is the content</div>
            </ItemTemplate>
======================================
They say, best men are moulded out of faults,
And, for the most, become much more the better
For being a little bad.
======================================
Reply With Quote
  #7 (permalink)  
Old April 8th, 2004, 03:12 AM
Registered User
 
Join Date: Apr 2004
Location: , , .
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Hi Rod,

I was interested to read your post.

I'm trying to do a similar thing and display a three level hierarchy in a tree like display, allowing users to navigate down the tree and update data in the lowest level of the tree.

My problem is that I only want to load up the top level of the hierarchy first as the lower levels could contain a lot of data and slow things down.

I want to then load the next level when the user drills down.

I've got something that works (kind of) by using nested repeaters but the page is rebuilt on every post which defeats the object really.

Have you come across anything that might do the trick for this? I'd be interested to hear if you have anything.

Many thanks.

Bruce

Reply With Quote
  #8 (permalink)  
Old April 8th, 2004, 03:44 AM
Friend of Wrox
Points: 2,376, Level: 20
Points: 2,376, Level: 20 Points: 2,376, Level: 20 Points: 2,376, Level: 20
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: , , Australia.
Posts: 596
Thanks: 1
Thanked 3 Times in 3 Posts
Default

Bruce,
Im afraid my solution is really only suitable to hide and show data already sent to the client side.
To use this method you would have to load all the data on then first pageload then show/hide it as the user drills down.
However once loaded the drilling down would be very smooth with no page reloads.
The point of nested repeaters should not be a problem.
If you are happy to download all the data at once give it a try, let me know if you need more help.

PS. Easter now wont be back till Tuesday.



======================================
They say, best men are moulded out of faults,
And, for the most, become much more the better
For being a little bad.
======================================
Reply With Quote
  #9 (permalink)  
Old April 8th, 2004, 10:44 AM
Registered User
 
Join Date: Apr 2004
Location: , , .
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Cheers Rod,

I'll let you know I get on.

Have a good Easter.

Bruce

Reply With Quote
  #10 (permalink)  
Old May 13th, 2004, 08:16 AM
Registered User
 
Join Date: May 2004
Location: , , .
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via MSN to Marcus Lawford-Miles
Default

An excellent way to build a collapsible menu. However, netscape being netscape document.all[] isn’t support. There for you can do the following.

<script language=javascript>
     function Show_Hide(element) {
         var AllDivElements = document.getElementsByTagName("div") ;
         if(AllDivElements [element].style.visibility == 'visible')
         {
             AllDivElements [element].style.visibility='hidden';
             AllDivElements [element].style.display='none';
         }
         else
         {
             AllDivElements [element].style.visibility='visible';
             AllDivElements [element].style.display='';
         }
    }
</script>

<a onclick="Show_Hide('CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%> ');"> This is the Link </a>
<div id='CustomerID_<%# DataBinder.Eval(Container.DataItem,"CustomerID")%> ' style='visibility:hidden;display:none'> This is the Content! </div>

Marcus

Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
asp.Net 2.0 and JavaScript zion22 ASP.NET 2.0 Professional 0 September 28th, 2006 01:10 PM
javascript in asp.net Komila Generics 0 August 3rd, 2006 01:24 AM
javascript with asp.net rajatake ASP.NET 1.0 and 1.1 Professional 0 June 22nd, 2006 04:35 AM



All times are GMT -4. The time now is 09:53 PM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.