Embedding collapsible menu within a table

Poster: ssegura
Dated: Wednesday November 22 2006 - 16:07:53 GMT

I have read comments in your forum of trying to embed a collapsible menu within a table but couldn't tell if the user actually got this to work. I have embedded a cascading menu into a table and it works great. I am now trying this with the collapsible menu but have not been successful. I am able to get the menu to view but when selecting a link with submenus, it will not open. I have used the example code Kevin sent and I think I have the code correct but am not seeing correct results. Could you let me know if adding the collapsible menu within a table has worked for any users? Would you mind checking the code below for me to see if I have missed anything? The following code is what I am using within the table and the menu_data.js it is calling.

Thanks in advance for your assistance.

Steve

Code in html file:

Poster: Ruth
Dated: Thursday November 23 2006 - 7:11:14 GMT

Hi,

I can't find out what is wrong, but I did find a fix. Add the following as the first submenu in the about_collapse_data_table.js file



For whatever reason if that dummy menu is in there, then all works fine.

Ruth

Embedding collapsible menu within a table

Poster: ssegura
Dated: Monday November 27 2006 - 15:23:05 GMT

Hi Ruth,

Thanks so much for your reply. Adding the code for the fix you provided worked as far as opening the menu. However, no text links showed for the "Overview" submenu from the about_collapse_data_table.js file. Just wondering if this was the case on your end or if you were able to see content when you click on the "Overview" link and the menu opens.

Steve

Embedding collapsible menu within a table

Poster: ssegura
Dated: Monday November 27 2006 - 15:33:59 GMT

Hi Ruth,

Seems when I turn off offbgcolor="" on the main menu the submenu appears. So the main menu properties cover up the submenu. Will do some tweaking to see if I can give the menu the look and feel I need. Can I add properties to the menu within the table? Thanks again for your help. Please disregard my previous email.

Steve

Embedding collapsible menu within a table

Poster: ssegura
Dated: Monday November 27 2006 - 16:51:18 GMT

Hi Ruth,

Your fix for the menu seems to be working just great. However I have a secondary submenu and the menu does not open. I tried to use variations of the fix you sent but with no success. The code below show a submenu "History" under the menu "Overview". When the Overview menu opens, I get no link on History that I can click on for it to open. Can you help? Thanks for your patience and assistance.

Steve

Poster: Ruth
Dated: Tuesday November 28 2006 - 2:14:43 GMT

Hi,

I'm unable to reproduce the problem using 5.763 or 5.764. You are going to have to give us a page so we can test it. Also, which browser and OS is this?

Ruth

Embedding collapsible menu within a table

Poster: ssegura
Dated: Tuesday November 28 2006 - 16:52:19 GMT

Good morning Ruth,

First, I want to thank you for your patience and diligence in helping me find a working solution.

I downloaded milonic_menu_ver5_764 this morning but it did not seem to make a difference in the menu.

I am working with Microsoft Windows XP Professional, Version 2002, Service Pack 2. I am using Microsoft Internet Explorer Version 6.0, SP2.

I have built a table as I want the collapsible menu positioned in a specified location. The code for the table and the menu_data I am using is below. You have helped with getting the first level menu to open but the second level menu and possibly the 3rd level do not open. You provided a fix using "dummy" sub1style code to get the 1st level menu to open. I tried to get this to work on the second level but with no success.

I have been able to get the collapsible menu to work correctly with all levels opening using the cascading style menu. However when I move to the table format I start seeing issues. Would you have an example of the collapsible menu working properly in table format?

In the about_collapse_data_table.js file, edited using menu_data.js, the "History" menu under "Overview" does not open. I have secondary menus under all 1st level menus. All files are located in the same folder as milonic_src.js and mmenudom.js.

Thanks again for you help and let me know if there is anything else you need from me.

Code for building table I am using:



Code for about_collapse_data_table.js being called.

Embedding collapsible menu within a table

Poster: ssegura
Dated: Wednesday November 29 2006 - 21:44:57 GMT

Ruth,

I have continued to read your forum and came across a message on treemenu.js and it being located under bolt modules on the Milonic site. I was using treemenu.js version 1.21. I downloaded the latest version 1.24 and it seems to have fixed the issue of submenus not opening correctly. Just wanted to let you know as you were helping me with a fix. I will continue to test the menu to make sure all is working properly. Thanks again for all you do. I'm sure you will hear from me if I have issues.

Steve

Embedding collapsible menu within a table

Poster: ssegura
Dated: Tuesday December 5 2006 - 19:31:53 GMT

Ruth,

I continue to work with the collapsible menu and have run into the issue of the menu not keeping state when moving to a new page. I read the Milonic version information on the following bug fix.



I have downloaded the latest version of the Milonic menu 5.765 and the latest version 1.26 of the treemenu. However, as you see in the examples below, the menu will not keep state when I click on a link to another page. I am also using openmenusbyurl.js and entered the call in the location specified but am not seeing correct results.

I created a Dreamweaver template and created all pages from a template. I have created the collapsible menu within a table and another without tables. On both instances I see the same result. When I click on the Overview link, the menu opens but when the overview page loads the menu closes.

In the examples below, I have submenus but only the Overview text is actually linked. When I click on the Overview link it renders the correct page but the the menu closes.

I feel that I am missing something or have a call out of place. Would you mind checking the links below to see if I have the code correct? Thanks in advance for your assistance.

Steve

This url is using the table format.

http://preview.lcra.org/newsletter/webteam/


This url is just calling the javascript files.

http://preview.lcra.org/newsletter/webt ... table.html

Poster: Ruth
Dated: Tuesday December 5 2006 - 21:43:59 GMT

Hi,

I don't think the openmenusbyurl is the thing you need to use. I think you need to use something called openBranchByName which is for the treemenu. Here's a post about that and what little I know about it.

http://www.milonic.com/forum/viewtopic. ... 9318#39318

I will play with your table page and see if I can get things working. I think you can use these in the data file, but until I experiment I don't really know.

Ruth

Poster: Ruth
Dated: Tuesday December 5 2006 - 22:55:06 GMT

Hi,

OK, if you put this on the overview.html page then the menu will open.



You could also put the openBranchByName right after the drawmenus(); without the script tags.


I guess you could put in all the branches you want opened, i.e. openBranchByName("overview");openBranchByName("whatever"); and so on but not sure on that. I am trying to get clarification on the use of this option and will get back to you when I know more.

Ruth

Embedding collapsible menu within a table

Poster: ssegura
Dated: Friday December 8 2006 - 19:33:57 GMT

Hi Ruth,

The OpenBranchByName script worked but trying to add it multple times does not as it seems to default to the last value entered.

I have a couple of other questions that I hope will have simple solutions. I am probably missing a property. In the example below I have given the clickcolor property the value of red as I would like to know by the menu what page I am on.

http://preview.lcra.org/newsletter/webteam/index.html

This seems to work for Overview and Leadership as the link turns to red when it renders the page. However, for the History link under Overview the History link does not change color. In the data file code I use below it seems that the tstyle1.clickcolor should work for the submenu as well. Should this be the case? Also when a menu opens it seems to generate twice. Is this because I have drawMenus() in the table code and the data file? Thanks again for your assistance.

Steve

Data file code below.


_scrollAmount=5 // Used for Netscape 4 scrolling
_scrollDelay=10 // Used for Netscape 4 scrolling

_menuCloseDelay=500 // The delay for menus to remain visible on mouse off
_menuOpenDelay=150 // The delay for opening menus on mouse over
_subOffsetTop=0; // Sub menu offset Top position
_subOffsetLeft=0; // Sub menu offset Left position

Goverfilter="Alpha(style=1,opacity=25,finishOpacity=100,startX=0,finishX=100,startY=100,finishY=0);Fade(duration=0.2);Shadow(color='#777777', Direction=135, Strength=5)"
Goverfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777', Direction=135, Strength=5)"
Goutfilter="randomdissolve(duration=0.3)"
Goutfilter=""
Goverfilter=""

AllMargin=0

treeOffset=0; // Used to set the offset of sub menus
singleMasterMenu=true // Informs the system to only have one menu open at a time

with(tstyle1=new mm_style()){
offcolor = "#2b4560";
fontweight = "bold";
onbgcolor = "#cccccc";
oncolor = "#2b4560";
offbgcolor=""
ondecoration="underline"
borderstyle = "solid";
subimage="/js/milonic/arrow_nav_t.gif"
onsubimage="/js/milonic/arrow_nav_down_t.gif"
bordercolor=""
borderwidth=0
padding = 2
fontsize = "10px";
fontfamily = "Verdana, Geneva, Arial, Helvetica, sans-serif";
subimageposition="top left" ;
separatorsize=1
separatorcolor="#ffffff";
//image="trans.gif"
subimagepadding=3
imagepadding=2
itemwidth=150
}


sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#2b4560";
sub1Style.fontweight = "normal";
sub1Style.margin = "20";
sub1Style.onbgcolor="#ffffff"
sub1Style.offbgcolor="#ffffff"
sub1Style.separatorcolor="#ffffff"

sub2Style=new copyOf(tstyle1)
sub2Style.offcolor = "#2b4560";
sub2Style.fontweight = "normal";
sub2Style.onbgcolor="#ffffff"
sub2Style.offbgcolor="#ffffff"
sub2Style.separatorcolor="#ffffff"


tstyle1.clickcolor="#ff0000"
tstyle1.clickbgcolor="#cccccc"
//tstyle1.clickimage="red_blip.gif"
tstyle1.clicksubimage="/js/milonic/arrow_nav_down_t.gif"

with(new menuname("dummy")){
style=sub1Style;
margin=AllMargin
}

with(new menuname("Overview")){
style = sub1Style;
aI("text=History;url=/newsletter/webteam/overview/history/history.html;showmenu=History;type=tree;");
aI("image=/js/milonic/transparent-spacer.gif;text=Faq;url=/about/faq.html");
aI("text=Maps;showmenu=Maps;type=tree;");
aI("image=/js/milonic/transparent-spacer.gif;text=Public Meeting Calendar;url=/about/meetings.htm");
aI("text=Financial Highlights;showmenu=Finance;type=tree;");
aI("image=/js/milonic/transparent-spacer.gif;text=Enabling Legislation;url=/about/lcra_enabling_legislation.html");
aI("image=/js/milonic/transparent-spacer.gif;text=Open Records Information;url=/about/openrecords.html");
aI("image=/js/milonic/transparent-spacer.gif;text=Contact LCRA;url=/contact.html");
}

with(new menuname("History")){
style = sub2Style;
aI("text=Early Years;url=/newsletter/webteam/overview/history/early_years.html;");
aI("text=An Era of Change;url=/about/history3.html;");
}

with(new menuname("Maps")){
style = sub2Style;
aI("image=transparent-spacer.gif;text=Map to LCRA's General Office Complex;url=/about/goc.html");
aI("image=transparent-spacer.gif;text=Map to LCRA's Dalchau Service Center;url=/about/dsc.html");
aI("image=transparent-spacer.gif;text=Electric Utility Customers Map;url=/energy/utilities");
aI("image=transparent-spacer.gif;text=Energy Facilities Map;url=/about/energy_facilities.html");
aI("image=transparent-spacer.gif;text=Transmission Service Map;url=/energy/trans_system_map.html");
aI("image=transparent-spacer.gif;text=Water and Wastewater Facilities Map;url=/about/water_wastewater_facilities_map.html");
aI("image=transparent-spacer.gif;text=Dams and Lakes Map;url=/about/dams_lakes.html");
aI("image=transparent-spacer.gif;text=Irrigation Districts Map;url=/about/irrigation_dist.html");
aI("image=transparent-spacer.gif;text=Water Quality Index Sites Map;url=/about/water_quality.html");
aI("image=transparent-spacer.gif;text=LCRA Parks System Map;url=/about/parks_preserves.html");
}

with(new menuname("Leadership")){
style = sub1Style;
aI("image=/js/milonic/transparent-spacer.gif;text=Board of Directors;url=/about/board.html");
aI("image=/js/milonic/transparent-spacer.gif;text=Board Agendas;url=/about/board_agenda.html");
aI("image=/js/milonic/transparent-spacer.gif;text=Board Meeting Schedule;url=/about/board_schedule.html");
aI("image=/js/milonic/transparent-spacer.gif;text=General Manager;url=/about/gm.html");
aI("image=/js/milonic/transparent-spacer.gif;text=Organization Chart;url=/docs/about_org_chart.pdf");
}

with(new menuname("Newsroom")){
style = sub1Style;
aI("text=News Releases;showmenu=Releases;margin=10;type=tree;");
aI("text=Feature Stories;showmenu=Features;type=tree;");
aI("image=transparent-spacer.gif;text=Ask LCRA;url=/about/list_asklcra.html");
aI("text=Photo Gallery;showmenu=Gallery;type=tree;");
aI("image=transparent-spacer.gif;text=Public Meeting Calendar;url=/about/meetings.html");
aI("text=Special Topics and Reports;showmenu=SpecialTopics;type=tree;");
aI("text=Resource Library;showmenu=Library;type=tree;");
aI("image=transparent-spacer.gif;text=How To Use RSS;url=/about/rss.html");
aI("image=transparent-spacer.gif;text=Recipes;url=/about/recipes.html");
}

with(new menuname("Employment")){
style = sub1Style;
aI("image=transparent-spacer.gif;text=Foundation Values;url=/about/foundation_values.html");
aI("image=transparent-spacer.gif;text=Employment FAQ;url=/about/jobfaq.html");
aI("image=transparent-spacer.gif;text=eRecruit FAQ;url=/about/erecruit_faq.html");
aI("image=transparent-spacer.gif;text=Job Vacancies;url=http://erecruit.lcra.org/psp/ER88PRD//EMPLOYEE/HRMS/c/ROLE_APPLICANT.ER_VIEW_JOBS.GBL");
aI("image=transparent-spacer.gif;text=H1B Application Notices;url=/docs/8.5-filing_notice.pdf");
aI("image=transparent-spacer.gif;text=Applicant Login;url=http://erecruit.lcra.org");
}

with(new menuname("Business")){
style = sub1Style;
aI("text=Proposal and Contract Opportunities;showmenu=Bids;type=tree;");
aI("image=transparent-spacer.gif;text=Status of Recent Opportunities;url=/about/purch_status.html");
aI("image=transparent-spacer.gif;text=Supplier Connection;url=http://esupplier.lcra.org");
aI("image=transparent-spacer.gif;text=Vendor Registration;url=http://esupplier.lcra.org/psp/ES88PRD/SUPPLIER/ERP/c/LCRA_PO_MNU.LCRA_VREG_CMPNT.GBL");
}

with(new menuname("Volunteers")){
style = sub1Style;
aI("text=LCRA Volunteers;showmenu=LCRAVOL;type=tree;");
}

drawMenus()

Poster: Ruth
Dated: Friday December 8 2006 - 21:53:01 GMT

Hi,

That click color is applied to the tstyle1. Why not use the pagecolor parameter to show where you are in the menu?


Set this in the tstyle1 and then all the submenus will use it so let's say you click history, when on that page Overview and History will be red, then if you click early years, Overview, History and Early Years will be red, showing the path in the menu.

Ruth