Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Help with understanding code please.

    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:

    Code:
    <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:
    Code:
    	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

    MAny thanks in anticipation of your help.
    Teresa

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,355
    Thanks
    11
    Thanked 558 Times in 551 Posts
    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

  • Users who have thanked devnull69 for this post:

    Treeze (07-22-2011)

  • #3
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts
    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?...

  • #4
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,355
    Thanks
    11
    Thanked 558 Times in 551 Posts
    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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •