manipulating contents of table cells
Hi,
Although I'm a total novice at building web pages, I figured the best way to learn is to do it. I've used a master page and, so far, all the basic information pages work OK.
My problem starts when I have several options for the same Content Holder. Is it possible to use clickable cells to show various *.html files in a different row in the same table.
I can show an image using a script but not a file.
<script type ="text/javascript" >
function Change() {
document.getElementById ('tdContentItem').innerHTML ='<img src="Images/Thumbs/Councillors.png"/>'
}
</script>
What I need to show is a clickable imagemap that loads the resulting pages into the same row.
It would make an old lady very happy if someone could point me in the right direction.
Re: manipulating contents of table cells
Hey,
Are you actually using an ImageMap at the minute? Is that part all working?
I am tempted to say, as a proof of concept, to include an IFrame on your page, and simply respond to the ImageMap clicks and change the location property of the IFrame, but in the long run, I wouldn't have said that would be the best approach.
Can you perhaps post a screen shot of what you have? I just want to confirm what you are currently seeing, so that we are visualizing the same thing.
What exactly is in the html files that you want to show? Could these be moved into ASP.Net User Controls? These could then be instantiated on the page when required. Or you could use a MultiView Control, and change the View when required based on the ImageMap selection.
There are a lot of options, but would need to know exactly what you are trying to do before making a final suggestion.
Gary
1 Attachment(s)
Re: manipulating contents of table cells
Hi Gary,
In the screenshot, the image is not an imagemap. I used an imagemap prior to using the script, but when the 'Parish Councillors' cell was clicked, the image map loaded in a separate window. The .innerHTML script was the only way I could find (or even understand) to get something to happen in the correct cell.
I've read about targets and iFrames but have not got to grips with the concepts yet.
Re: manipulating contents of table cells
Hey,
Ok, so from what I can see in the screen shot, am I right in saying the following. For each of the "tabs", i.e. Parich Councillors, Council Diary, Council Minutes, Planning, you have an html file that you want to display, is that right?
Based on what you have shown, I would suggest a MultiView. Each View within the MultiView would contain the content of each html file, and the links that you have, i.e. Parish Councillors, would change the ActiveViewIndex.
Hope that helps!
Gary
Re: manipulating contents of table cells
Thanks for that Gary. You are right that for each of the 'tabs' I have an html file that I want to display.
Leave it with me and I'll research a MultiView so that I understand what's going on.
Being a pensioner, it may take a little while.
Re: manipulating contents of table cells
Ha ha, no worries.
Let me know if you have any questions. You could easily do this with an IFrame:
http://www.cryer.co.uk/resources/javascript/script4.htm
But it isn't really the "done" thing, that I why I am suggesting an alternative. The other approach would be to use a Master Page, with several content pages, and then have a styled menu control which provides the links to the other pages.
The latter is slightly more involved, but still not that difficult.
Gary
Re: manipulating contents of table cells
I'm using a Master Page as you've suggested and it's just this one particular Content Page that it proving problematic.
I will certainly keep you up to date on my progress. You've given me plenty of 'food for thought'.
Lesley
Re: manipulating contents of table cells
Hey,
Ah, ok, so stick with the Master Page solution, I missed that in your initial post.
Take each html page that you have, and turn it into a Content Page. This shouldn't be too hard, just create a new web form, select the Master Page you want to hook it up to, then port over the html into the new page.
Do you have a web.sitemap already? If not, create one, listing all the pages that you have, from the looks of it, you will have four. Add a Menu control to the Master Page, using the web.sitemap as the DataSource, and then style the menu to make it look the way you want.
Here is a walkthrough that might help:
http://msdn.microsoft.com/en-us/library/305w735z.aspx
Gary
Re: manipulating contents of table cells
Hi Gary,
Thanks for the web.stemap walkthrough. I used the masterpage walkthrough to get me started on this (ad)venture.
I shall do as you suggested and create a web.sitemap as I'm not using one at present.
I'm working on the MultiView as it looks as though it could be the answer to my problem. I should be able to transfer the knowledge to another interactive page that will need to be created.
Thanks so much for your help so far.
Lesley
Re: manipulating contents of table cells
Hey,
Not a problem, happy to help.
Let me know how you get on.
Gary