/*the ø stands for document.getElementById*/
function conwidth(){
var a=document.getElementsByClassName('dropdown');
var e=[];
for(i=0;i<=a.length;i++){
	if(a[i].innerHTML.length>28){
/*Safari Error (only if I bypass the setwid(j,k)command):
TypeError: 'undefined' is not an object (evaluating 'a[i].innerHTML')*/
		e.push(a[i].innerHTML);
		var j=ø(a[i].parentNode.id).parentNode.id;
		var k=200+8*(a[i].innerHTML.length-28);
		setwid(j,k);
	}
}
}
function setwid(b,c){
var dr=document.getElementsByClassName('dropdown');var st=document.getElementsByClassName('strich');var a=function(a){return ø(a.parentNode.id).parentNode.id;};
/*Safari Error: TypeError: 'undefined' is not an object (evaluating 'a.parebtNode')*/
for(i=0;i<=dr.length;i++){if(a(dr[i])==b){console.log('width');
dr[i].style.width=c+21+"px";}ø(b).style.width=c+"px";}
/*I get 14 width console.logs, but 0 strich!
but if i change their places i get 4 strich and 0 width*/
for(i=0;i<=st.length;i++){if(a(st[i])==b){console.log('strich');st[i].style.width=c+40+"px";}}
}

Could someone please explain me those errors and what I have to correct?

Trickist,

Main problem is in the exit conditions of the for statements, eg.:

for(i=0; i<=dr.length; i++) {...}
//should read 
for(i=0; i<dr.length; i++) {...}

The code can be simplified elsewhere, chiefly to work with elements rather than their ids.

var j = ø(a[i].parentNode.id).parentNode.id;
//will simplify to 
var j = a[i].parentNode.parentNode.id;
//and 
var j = a[i].parentNode.parentNode;
//will allow you to pass the element rather than its id to setwid(), which is more useful.

conwidth() would be improved by looping through the container (.parentNode.parentNode) elements. Looping through the dropdowns causes each container to be addressed several times over, with the nett effect that the last dropdown in each container determines its width.

You probably want the longest dropdown to determine the width of its container, requiring that (for each container) a running maximum is maintained, which feeds the statement container.style.width = maximum + "px"; (or similar).

Airshow

What does maximum stand for? Could you please give an example.

maximum would be a variable containing the running maximum calculated in the loop. Then the statement container.style.width = maximum + "px"; would be executed below the loop.

I can't rewrite conwidth() in full without knowledge of the HTML.

Airshow

<ul class="maindropdown l" id="firdrop" style="display:none;">
    <div id="fir" class="dum">
            <li class="dropdown"></li>
            ......
    </div>
</ul>
<ul class="maindropdown l" id="secdrop" style="display:none;">
    <div id="sec" class="dum">
            <li class="dropdown"></li>
            <li class="strich"></li>
            ......
    </div>
</ul>
...

That's invalid HTML. You can't have a DIV inside a UL like that.

Airshow

I know, but it works! It's needed...

/*the ø stands for document.getElementById*/
function conwidth(){
var a=document.getElementsByClassName('dropdown');
var e=[];
for(i=0;i<=a.length;i++){
	if(a[i].innerHTML.length>28){
/*Safari Error (only if I bypass the setwid(j,k)command):
TypeError: 'undefined' is not an object (evaluating 'a[i].innerHTML')*/
		e.push(a[i].innerHTML);
		var j=ø(a[i].parentNode.id).parentNode.id;
		var k=200+8*(a[i].innerHTML.length-28);
		setwid(j,k);
	}
}
}
function setwid(b,c){
var dr=document.getElementsByClassName('dropdown');var st=document.getElementsByClassName('strich');var a=function(a){return ø(a.parentNode.id).parentNode.id;};
/*Safari Error: TypeError: 'undefined' is not an object (evaluating 'a.parebtNode')*/
for(i=0;i<=dr.length;i++){if(a(dr[i])==b){console.log('width');
dr[i].style.width=c+21+"px";}ø(b).style.width=c+"px";}
/*I get 14 width console.logs, but 0 strich!
but if i change their places i get 4 strich and 0 width*/
for(i=0;i<=st.length;i++){if(a(st[i])==b){console.log('strich');st[i].style.width=c+40+"px";}}
}

Could someone please explain me those errors and what I have to correct?

The javascript error is caused by your ø sign.

You need to make sure that ø symbol is a part of the language specified in the document - and javascript is depending on browser implementation possible to ignore it, therefore misinterpret it, -why not use id(...) instead of ø ?

The ø is definitely not the problem, it works perfectly.I have replaced it so that it's now $.g() and there are still the same problems!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.