PDA

View Full Version : Switch order of script



Bar2aYunie
01-30-2010, 05:51 PM
Hello people!

I have a script which will display a few linked drop down boxes with some information about the chosen option. It was originally working in this order: VisitekaartjesSize - VisitekaartjesSizeInfo - VisitekaartjesColor - VisitekaartjesColorInfo - VisitekaartjesMaterials - VisitekaartjesMaterialsInof - VisitekaartjesFInish - VisitekaartjesFinishInfo.

The word 'Visitekaartjes' is the name of the product it's displaying, so don't mind that. So I'm actually displaying certain details about the product and the visitors need to make a selection to continue. The Size, Color, Materials and Finish are the names of the select list boxes and there where the word 'Info' has been added will mean that a line of information will be shown underneath the select boxes when an option has been chosen.

Now, I'd like to change that order and like it to appear in this order:
VisitekaartjesMaterials - VisitekaartjesMaterialsInof - VisitekaartjesFInish - VisitekaartjesFinishInfo - VisitekaartjesSize - VisitekaartjesSizeInfo - VisitekaartjesColor - VisitekaartjesColorInfo.

So the last two boxes and information will be displayed first, then the other two boxes and information. I've tried just chaning it in html and changing a bit of code to make the last two appear first. However, when I'm executing the script, it still starts with the VisitekaartjesSize box and not the VIsitekaartjesMaterials box, what I want.

Am I missing something here that I need to change? I don't see which part of the code states that the VisitekaartjesSize needs to be selected first.

Here's the script code:



<script type="text/javascript">
/* <![CDATA[ */

function toggle(IDS) {
sel = document.getElementById(IDS);
sel.style.display = (sel.style.display != 'block') ? 'block' : 'none';
}

Array.prototype.exists = function (x) {
for (var i = 0; i < this.length; i++) {
if (this[i] == x) return true;
}
return false;
}

function Populate(IDS,incItems) {
var itemArr = [];
switch (IDS) {
case 'VisitekaartjesMaterials' : itemArr = VisitekaartjesMaterials; break;
case 'VisitekaartjesFinish' : itemArr = VisitekaartjesFinish; break;
case 'VisitekaartjesSize' : itemArr = VisitekaartjesSize; break;
case 'VisitekaartjesColor' : itemArr = VisitekaartjesColor; break;
}

// alert('1. '+IDS+'\n\n2. '+incItems);
var selElem = document.getElementById(IDS);
selElem.options.length = 0; var k = 0;
var tarr = []; var bypass = []; // temporary holding arrays

if (incItems == '') { // current selections -- show all if blank
for (var i=0; i<itemArr.length; i++) {
tarr = itemArr[i].split('|'); // create display, itemArray, include items
selElem.options[selElem.options.length] = new Option(tarr[0],itemArr[i]);
}
} else {
tarr = incItems.split('|');
bypass = tarr[2].split(','); // alert(tarr.join('\n')+'\n\n'+bypass.join('\n'));
for (var j=0; j<bypass.length; j++) {
k = bypass[j]; // get entry to create item
tarr = itemArr[k].split('|'); // create display, itemArray, include items
selElem.options[selElem.options.length] = new Option(tarr[0],itemArr[k]);
}
}
}

function Validate(flag) {
var str = '';
var stmp = [];
var tarr = [];
tarr = document.getElementById('p1').getElementsByTagName('select');
stmp = [];
for (var j=0; j<tarr.length; j++) {
if (tarr[j].selectedIndex > 0) { stmp.push(tarr[j].value); }
}
document.getElementById(IDSinfo).innerHTML = tarr.join('<p>');
return false;
}

function SelectionInformation(IDS) {
var sarr = [];
switch (IDS) {
case 'VisitekaartjesMaterials' : sarr = VisitekaartjesMaterialsInfo; break;
case 'VisitekaartjesFinish' : sarr = VisitekaartjesFinishInfo; break;
case 'VisitekaartjesSize' : sarr = VisitekaartjesSizeInfo; break;
case 'VisitekaartjesColor' : sarr = VisitekaartjesColorInfo; break;

}
var sel = document.getElementById(IDS);
var tid = IDS+'Info';
var SIndx = sel.selectedIndex;
if (SIndx > 0) { document.getElementById(tid).style.display = 'block'; }
else { document.getElementById(tid).style.display = 'none'; }
var str = sarr[SIndx];
str += '<p>'+sarr[0];
document.getElementById(tid).innerHTML = str;
}

/* ]]> */
</script>


Any help would be greatly appreciated!!