Need help with addboxes() function..

Hi all :) I've been doing numerous research on incrementing variables. and I've come to a little bump in the road. What the problems are is that when i try to use the function addelement(), it cant find my element, and returns ' "divnamehere" is invalid', and when you enter a variable into the variable box, then click add box, and then enter a custom number into the custom # of boxes box, and click custom # of boxes, it should automatically figure out the next number, not stay on the number depending on what you click. and the same thing should happen opposite as well. if u enter a custom number into the custom number box, then enter a variable name into the variable box, press the custom # of boxes button, then press the add box button, it shouldnt stay on the same number, it should increment.

Here's the code:

<script>function addboxes(myDiv){

var ni = document.getElementById(myDiv);

var customnum = document.forms.test.vcustom.value;

if(! ni){

alert(myDiv+' not valid');

} else {

if ('document.forms.test.custom.onClick' && document.getElementById("boxes").innerHTML == "") {

document.forms.test.add.disabled = true;

}

if(document.forms.test.vcustom.value == null || document.forms.test.vcustom.value == ""){

alert('Please enter a custom # for amount of boxes then click custom # of boxes');

} else {

document.forms.test.add.disabled = false;

num++;

var newdiv = document.createElement('div');

newdiv.setAttribute("id",divIdName);

if(customnum != null || customnum != ""){

for(var cnum=1;cnum<=customnum;cnum++){

xnum++;

document.getElementById('boxes').innerHTML += 'Name '+xnum+': <input type="text" name="var'+xnum+'"><br>\n';

}

}

ni.appendChild(newdiv);
}
}
}

function addElement(myDiv) {

var ni = document.getElementById(myDiv);

if(! ni){

alert(myDiv+' not valid');

} else {

if ('document.forms.test.add.onClick') {

if(document.forms.test.zaname.value == null || document.forms.test.zaname.value == ""){

alert('Please enter a variable then click add box');

} else {

num++;

var newdiv = document.createElement('div');

newdiv.setAttribute("id",divIdName);

newdiv.innerHTML = 'Name '+num+': <input type="text" name="blah'+num+'">\n';

ni.appendChild(newdiv);
}
}
}
}

function removeElement(divNum) {

var d = document.getElementById(divNum);

if(! d){

alert('Enter something into variable box, click add box, then click delete box');

} else {

d.parentNode.removeChild(d);
num--;
}
}

function clearform(){

if('document.forms.test.remove.onClick'){

if(document.forms.test.zaname.value != "" || document.forms.test.zztest.value != "" || document.getElementById("boxes").innerHTML != "" || document.forms.test.vcustom.value != ""){

document.forms.test.zaname.value = "";
document.forms.test.zztest.value = "";
document.getElementById("boxes").innerHTML = "";
document.forms.test.vcustom.value = "";

num=0;
xnum=0;

alert('\Cleared!');

} else {

alert('There isn\'t anything TO clear\!');

}

}

}

// var x1=0;
// var num=4;

function ztest(){

if('document.forms.test.zzsubmit.onClick'){

if(document.forms.test.zaname.value == null || document.forms.test.zaname.value != "" && document.getElementById("boxes").innerHTML == "" || document.forms.test.zaname.value == ""){

alert('Enter a var name then click add box enter your data then click submit');

} else {

zname();

}
}
}

function zname(){

var vname = document.forms.test.zaname.value;
var comma = '","';
var i = 1;
var a = [];
var str = "";

alert(document.forms.test['blah'+num].value);

if(document.forms.test['blah'+num].value == null || document.forms.test['blah'+num].value == ""){

alert('Enter data!');

} else {

if(vname != null && vname != "" && document.forms.test['blah'+num].value != null && document.forms.test['blah'+num].value != ""){

while (typeof(document.forms.test['blah' + i]) != "undefined") {
a.push(document.forms.test['blah' + i++].value);
}

str += 'var '+vname+' = new Array("';
str += a.join(comma);
str += '");';

document.getElementById("zztest").innerHTML = str;
}
}
}</script>

<form name="test">

<script>
var num = 0;
var xnum = 0;
var divIdName = num;
</script>

<Center><p align="center">
<script>
<!--Hide from old browsers


document.write('Variable name:<br><span name="zbox" style="background-Color: #44CFFC;"><input type="text" size="30" name="zaname"></span><script>for(var x=1;x<=2;x++){document.write(\'<br>\');}</script>\n');

document.write('<input type="button" value="Add variables" name="avar" onclick="addElement(\'zbox\');"><script>for(var x=1;x<=2;x++){document.write(\'<br>\');}</script>\n');

document.write('Output:<br><textarea name="zztest" cols="40" rows="15" style="background-Color: #44CFFC;"></textarea><script>for(var x=1;x<=2;x++){document.write(\'<br>\');}</script>\n');

document.write('<input type="button" name="add" value="Add box" onClick="addElement(\'boxes\');">\n');

document.write('<input type="button" name="del" value="Delete box" onClick="removeElement('+divIdName+');"><br>\n');

document.write('Custom:<br><span name="zcustom" style="background-Color: #44CFFC;"><input type="text" size="30" name="vcustom"></span><script>for(var x=1;x<=2;x++){document.write(\'<br>\');}</script><br>\n');

document.write('<input type="button" name="custom" value="Custom # of boxes" onClick="addboxes(\'boxes\');">\n');

document.write('<input type="button" name="zzsubmit" onClick="ztest();" value="Submit"><br>\n');

document.write('<input type="button" name="remove" value="Clear" onClick="clearform();"><br>\n');

document.write('Array boxes:<br><span id="boxes" style="background-Color: #44CFFC; width: 400px; height: 25px;"></span><br>\n');


-->
</script>

</p></Center>
</form>

ANY help is GREATLY appreciated! :)

Thanks! :)

~SI~

Right off the bat, I see code that makes no sense:

if ('document.forms.test.custom.onClick' && document.getElementById("boxes").innerHTML == "") {


You have a *STRING* there:
'document.forms.test.custom.onClick'

And since a STRING will always be NON-null, you might as well have coded

if ( true && document.getElementById("boxes").innerHTML == "") {

which means you could have coded

if (document.getElementById("boxes").innerHTML == "") {


So what was the purpose of putting in that string???

well. its supposed to return a string based on whats in the text box(es). the prob is as i said before, no matter what order u click the buttons, it increments the value.