...

View Full Version : Help with understanding code please.



Treeze
07-22-2011, 11:21 AM
Hi
We are currently re-working a client's website and as I am not a javascript programmer I am having trouble understanding some of the code, and need help understanding why a certain variable in the code remains undefined. The javascript function is called from the web page in this fashion:


<select name="cboL1_3" onchange="CheckLine(this);">
<option value=""></option>
<option value="l">L</option>
<option value="m">M</option>
</select>

and the function CheckLine is defined thus:

function CheckLine(el)
{
var Mok = false, Lok = false, val, currEl;
var LineNo = el.name;
LineNo = LineNo.substring(4,(LineNo.length - 2));
val = el.options[el.selectedIndex].value;
alert(el);
alert(val);
if (val == 'm')
{
Mok = true;
}
if (val == 'l')
{
Lok = true;
}
for (var i = 1; i<=4; i++)
{
currEl = document.frmDisc.elements['cboL' + LineNo + '_' + i];
if (currEl.name != el.name)
{
if (currEl.options[currEl.selectedIndex].value == 'm')
{
if (Mok)
{
currEl.selectedIndex = 0; //resets selection to blank if >1 M
}
Mok = true;
}
if (currEl.options[currEl.selectedIndex].value == 'l')
{
if (Lok)
{
currEl.selectedIndex = 0;//resets selection to blank if >1 L
}
Lok = true;
}
}

}
}

What is happening is that the user is filling in 24 lines of 4 select boxes, in which there must be 1 and only one "m" and 1 and only 1 "l". The code changes the value of the box back to blank if the user has tried to enter >1 of either. The code then should check the line number and count the number of lines, but on debugging I see that the value of variables el and LineNo are undefined. I can't understand why when the function is called, the value "this" is used. i.e CheckLine(this) - this appears to have no value in the html code as far as I can see! Perhaps someone could shed some light on this for me, as I really need to get it working TODAY!! I also enclose a link to the webpage in question:

www.kellyresources.co.uk/disc/disc.asp (http://www.kellyresources.co.uk/disc/disc.asp)

MAny thanks in anticipation of your help.
Teresa

devnull69
07-22-2011, 11:59 AM
In event handlers like onchange "this" is a reference to the current element. In your example "this" is the <select name="cboL1_3">

If you debug the code you'll see that the variables are not undefined. See here: http://jsbin.com/exavoj If you hover the mouse over the example page you will see a button "Edit using JS Bin" on the top right corner. You can use the button to show the full source (HTML/Javascript) involved

Treeze
07-22-2011, 12:22 PM
Thank you so much for your help. What is this jsbin thing? Looks like a great tool for debugging - I had been using Firebug for Firefox and it wasn't giving me these values at all, unless maybe the code doesn't work in FF for some reason?...

devnull69
07-22-2011, 12:44 PM
To enter debug mode in Firebug you'll have to set a breakpoint and refresh the page ... it will then reach the breakpoint and you can step through each line of code and see the current variable values.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum