Chained Select Menu - Window popup resized

[RChicken]

1) Script Title: Chained Select Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/chainedmenu/

3) Describe problem:
I have 3 of these chained menus running on one page. All three work just fine, however on my 3rd menu when the user clicks go, i want it to open up in a new window that is resizeable. But the real problem is when i set the config.js for newwindow = 1, it enables the other 2 chained menus to open in a new window. Each chained menu runes on a seperate file so each config is different. Its just when i set newwindow = 1, it sets it to all the chained. i tried to rename newwindow to something else so that it would not be confused with the other config.js but that didn't work.

Question Part 2:
how can i get the windows to popup resized to specific settings that i have for it.

else if (newwindow==1)
window.open(selectedOptionvalue)
else
window.location=selectedOptionvalue
break

[jscheuer1]

Set:

var newwindow=1 //Open links in new window or not? 1=yes, 0=no.

to one as shown.

This is the function you are concerned with:

function goListGroup(){
for (i=arguments.length-1;i>=0; i--){
if (arguments[i].selectedIndex!=-1){
var selectedOptionvalue=arguments[i].options[arguments[i].selectedIndex].value
if (selectedOptionvalue!=""){
if (onclickaction=="alert")
alert(selectedOptionvalue)
else if (newwindow==1)
window.open(selectedOptionvalue)
else
window.location=selectedOptionvalue
break
}
}
}
}

In it:

arguments[i]

should represent the select element. So, say you have markup like so:

<form name="listmenu0">
<table><tr>
<td><select name="firstlevel" style="width:180px;"></select></td>
<td><select name="secondlevel" style="width:160px;"></select></td>

<td><select name="thirdlevel" style="width:160px;"></select></td>
<td><input type="button" value="Go" onclick="goListGroup(document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel)">
</tr></table>
</form>

The form name in this case is:

listmenu0

so you could test for that:

else if (newwindow==1&&arguments[i].form==document.forms['listmenu0'])

where:

listmenu0

is the name of the form that contains the go button that you want to have a new window.

Now, as to specifications for the new window, you could do:

window.open(selectedOptionvalue,'_blank','top=100, left=150, height=400, width=500, resizable, scrollbars=auto')

See:

http://www.w3schools.com/htmldom/met_win_open.asp

for other available specifications. Not all specifications work in all browsers. Most do.

[RChicken]

Ok that worked great Thank you!

However i am getting an error if i have populated all the chained boxes. the error is:

Error: uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMHTMLSelectElement.selectedIndex]" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: http://10.0.0.81/scripts/menus/chainedmenu.js :: cs_refreshList :: line 83" data: no]

updated chainedmenu.js

var _disable_empty_list=false;
var _hide_empty_list=false;


var onclickaction="alert"

function goListGroup(){
for (i=arguments.length-1;i>=0; i--){
if (arguments[i].selectedIndex!=-1){
var selectedOptionvalue=arguments[i].options[arguments[i].selectedIndex].value
if (selectedOptionvalue!=""){
if (onclickaction=="alert")
alert(selectedOptionvalue)
else if (newwindow==1&&arguments[i].form==document.forms['listmenu2'])
window.open(selectedOptionvalue,'_blank','top=100, left=150, height=200, width=400, resizable, scrollbars=auto')
else


window.location=selectedOptionvalue
break
}
}
}
}


if (typeof(disable_empty_list)=="undefined") { disable_empty_list=_disable_empty_list; }
if (typeof(hide_empty_list)=="undefined") { hide_empty_list=_hide_empty_list; }

var cs_goodContent=true, cs_M="M", cs_L="L", cs_curTop=null, cs_curSub=null;

function cs_findOBJ(obj,n) {
  for (var i=0; i<obj.length; i++) {
    if (obj[i].name==n) { return obj[i]; }
  }
  return null;
}
function cs_findContent(n) { return cs_findOBJ(cs_content,n); }

function cs_findM(m,n) {
  if (m.name==n) { return m; }

  var sm=null;
  for (var i=0; i<m.items.length; i++) {
    if (m.items[i].type==cs_M) {
      sm=cs_findM(m.items[i],n);
      if (sm!=null) { break; }
    }
  }
  return sm;
}
function cs_findMenu(n) { return (cs_curSub!=null && cs_curSub.name==n)?cs_curSub:cs_findM(cs_curTop,n); }

function cs_contentOBJ(n,obj){ this.name=n; this.menu=obj; this.lists=new Array(); this.cookie=""; }; cs_content=new Array();
function cs_topmenuOBJ(tm) { this.name=tm; this.items=new Array(); this.df=0; this.addM=cs_addM; this.addL=cs_addL; }
function cs_submenuOBJ(dis,link,sub) {
  this.name=sub;
  this.type=cs_M; this.dis=dis; this.link=link; this.df=0;

  var x=cs_findMenu(sub);
  this.items=x==null?new Array():x.items;

  this.addM=cs_addM; this.addL=cs_addL;
}
function cs_linkOBJ(dis,link) { this.type=cs_L; this.dis=dis; this.link=link; }

function cs_addM(dis,link,sub) { this.items[this.items.length]=new cs_submenuOBJ(dis,link,sub); }
function cs_addL(dis,link) { this.items[this.items.length]=new cs_linkOBJ(dis,link); }

function cs_showMsg(msg) { window.status=msg; }
function cs_badContent(n) { cs_goodContent=false; cs_showMsg("["+n+"] Not Found."); }

function cs_optionOBJ(text,value) { this.text=text; this.value=value; }
function cs_emptyList(list) { for (var i=list.options.length-1; i>=0; i--) { list.options[i]=null; } }
function cs_refreshList(list,opt,df) {
  cs_emptyList(list);

  for (var i=0; i<opt.length; i++) {
    list.options[i]=new Option(opt[i].text, opt[i].value);
  }

  if (opt.length>0) {
    list.selectedIndex=df;
  }
}
function cs_getOptions(menu) {
  var opt=new Array();
  for (var i=0; i<menu.items.length; i++) {
    opt[i]=new cs_optionOBJ(menu.items[i].dis, menu.items[i].link);
  }
  return opt;
}
function cs_updateListGroup(content,idx,sidx,mode) {
  var i=0, curItem=null, menu=content.menu;

  while (i<idx) {
    menu=menu.items[content.lists[i++].selectedIndex];
  }

  if (menu.items[sidx].type==cs_M && idx<content.lists.length-1) {
    var df=cs_getIdx(mode,content.cookie,idx+1,menu.items[sidx].df);

    cs_refreshList(content.lists[idx+1], cs_getOptions(menu.items[sidx]), df);
    if (content.cookie) {
      cs_setCookie(content.cookie+"_"+(idx+1),df);
    }

    if (idx+1<content.lists.length) {
      if (disable_empty_list) {
        content.lists[idx+1].disabled=false;
      }
      if (hide_empty_list) {
        content.lists[idx+1].style.display="";
      }

      cs_updateListGroup(content,idx+1,df,mode);
    }
  }
  else {
    for (var s=idx+1; s<content.lists.length; s++) {
      cs_emptyList(content.lists[s]);

      if (disable_empty_list) {
        content.lists[s].disabled=true;
      }
      if (hide_empty_list) {
        content.lists[s].style.display="none";
      }

      if (content.cookie) {
        cs_setCookie(content.cookie+"_"+s,"");
      }
    }
  }
}
function cs_initListGroup(content,mode) {
  var df=cs_getIdx(mode,content.cookie,0,content.menu.df);

  cs_refreshList(content.lists[0], cs_getOptions(content.menu), df);
  if (content.cookie) {
    cs_setCookie(content.cookie+"_"+0,df);
  }

  cs_updateListGroup(content,0,df,mode);
}

function cs_updateList() {
  var content=this.content;
  for (var i=0; i<content.lists.length; i++) {
    if (content.lists[i]==this) {
      if (content.cookie) {
        cs_setCookie(content.cookie+"_"+i,this.selectedIndex);
      }

      if (i<content.lists.length-1) {
        cs_updateListGroup(content,i,this.selectedIndex,"");
      }
    }
  }
}

function cs_getIdx(mode,name,idx,df) {
  if (mode) {
    var cs_idx=cs_getCookie(name+"_"+idx);
    if (cs_idx!="") {
      df=parseInt(cs_idx);
    }
  }
  return df;
}

function _setCookie(name, value) {
  document.cookie=name+"="+value;
}
function cs_setCookie(name, value) {
  setTimeout("_setCookie('"+name+"','"+value+"')",0);
}

function cs_getCookie(name) {
  var cookieRE=new RegExp(name+"=([^;]+)");
  if (document.cookie.search(cookieRE)!=-1) {
    return RegExp.$1;
  }
  else {
    return "";
  }
}

// ----
function addListGroup(n,tm) {
  if (cs_goodContent) {
    cs_curTop=new cs_topmenuOBJ(tm); cs_curSub=null;

    var c=cs_findContent(n);
    if (c==null) {
      cs_content[cs_content.length]=new cs_contentOBJ(n,cs_curTop);
    }
    else {
      delete(c.menu); c.menu=cs_curTop;
    }
  }
}

function addList(n,dis,link,sub,df) {
  if (cs_goodContent) {
    cs_curSub=cs_findMenu(n);

    if (cs_curSub!=null) {
      cs_curSub.addM(dis,link||"",sub);
      if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; }
    }
    else {
      cs_badContent(n);
    }
  }
}

function addOption(n,dis,link,df) {
  if (cs_goodContent) {
    cs_curSub=cs_findMenu(n);

    if (cs_curSub!=null) {
      cs_curSub.addL(dis,link||"");
      if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; }
    }
    else {
      cs_badContent(n);
    }
  }
}

function initListGroup(n) {
  var _content=cs_findContent(n), count=0;
  if (_content!=null) {
    content=new cs_contentOBJ("cs_"+n,_content.menu);
    cs_content[cs_content.length]=content;

    for (var i=1; i<initListGroup.arguments.length; i++) {
      if (typeof(arguments[i])=="object" && arguments[i].tagName && arguments[i].tagName=="SELECT") {
        content.lists[count]=arguments[i];

        arguments[i].onchange=cs_updateList;
        arguments[i].content=content; arguments[i].idx=count++;
      }
      else if (typeof(arguments[i])=="string" && /^[a-zA-Z_]\w*$/.test(arguments[i])) {
        content.cookie=arguments[i];
      }
    }

    if (content.lists.length>0) {
      cs_initListGroup(content,content.cookie);
    }
  }
}

function resetListGroup(n) {
  var content=cs_findContent("cs_"+n);
  if (content!=null && content.lists.length>0) {
    cs_initListGroup(content,"");
  }
}
// ------

[jscheuer1]

I've taken your code and made up an example page. I get no such error. I'm using the config file from the demo page though, and only one group of selects.

Still, things are working as expected, no errors. It would be hard for me to imagine what all you have in your config file, or how you have your page setup.

If you could give me a link to a live demo of the problem, I can probably trace it down.

Please post a link to a page on your site that contains the problematic code so we can check it out.

[RChicken]

I've taken your code and made up an example page. I get no such error. I'm using the config file from the demo page though, and only one group of selects.

Still, things are working as expected, no errors. It would be hard for me to imagine what all you have in your config file, or how you have your page setup.

If you could give me a link to a live demo of the problem, I can probably trace it down.

Please post a link to a page on your site that contains the problematic code so we can check it out.

http://www.fulllineexhaust.com/new/justflowmaster.htm

There is the link, now for the error to happen is you have a selection in each of the drop down boxes and then hit refresh. By the 2nd refresh i get the error.

[jscheuer1]

Not happening here. What browser and OS are you using?

[RChicken]

Not happening here. What browser and OS are you using?

firefox with windows 2k

[jscheuer1]

I do have FF, in fact - since the error you quoted looked like it came from that browser, that's the browser I used to test in. I did have cookies disabled though. Re-enabling them, I now get the error - after only one refresh. I will look into this, but I am not sure if it is anything to do with the modifications we made. It could be the use of the cookie with multiple groups. The easiest thing would be to disable the cookie portion of the code (get rid of the red part in each initListGroup call):

<body onload="initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'saveit')">

If it is the multiple cookie issue, using a different string for each save might work, like use , 'saveita' for the first initListGroup call, and , saveitb' for the second and , saveitc for the third group, and so on. Note the use of letters only. The script appears to only accept letters here.

[jscheuer1]

That looks like it is it. I just tried a local copy of the page with this body tag:

<body onload="initListGroup('exhaust_systems', document.listmenu0.firstlevel, document.listmenu0.secondlevel, 'saveita');initListGroup('diesel_systems', document.listmenu1.firstlevel, document.listmenu1.secondlevel, 'saveitb');initListGroup('flowmaster_sounds', document.listmenu2.firstlevel, document.listmenu2.secondlevel, 'saveitc')" leftmargin="0" topmargin="0" marginheight="0" marginwidth="0">

No errors, and the cookies worked! I noticed that (since my last post) before, with the error, only the first selects' cookie seemed to work.