NaN Error in IE - Not Firefox 1

[AMTK54]

Let me start by saying that I really have no knowledge or experience in Javascript. I'm not the individual at my company who's in charge of maintaining the website, but I was brought it on this issue and am trying to find a solution.

We have some simple javascript on a page to generate a total for bus pass purchases (it can be seen here:

https://www.cctaride.org/bus-information/purchase-passes.html)

In Firefox and Safari, the total box works perfectly, however in IE, it displays "NaN." I've done some research on the issue and believe the problem is similar to what was going on here:

http://www.tek-tips.com/viewthread.cfm?qid=1472885&page=12

However, since I really have no knowledge of Javascript, I'm unable to fix it. Would someone be able to explain what changes I need to correct the issue? I've pasted the relevant code below, though if one wants to see the full source of the page, they can do so by going to the link above.

Thanks in advance for the assistance!

<script language="javascript">

function updateSum(updated)

{

  var a10, aMon, s10, sMon, y10, yMon, l10, lMon, ll10, llMon, total, grandTotal, sum;

  a10  = parseInt(document.getElementById("Addult 10-ride").value);

  aMon = parseInt(document.getElementById("Addult Monthly").value);

  s10  = parseInt(document.getElementById("Senior 10-ride").value);

  sMon = parseInt(document.getElementById("Senior Monthly").value);

  y10  = parseInt(document.getElementById("Youth 10-Ride").value);

  yMon = parseInt(document.getElementById("Youth Montly").value);

  l10  = parseInt(document.getElementById("LINK 10-Ride").value);

  lMon = parseInt(document.getElementById("LINK Monthly").value);
  
  ll10 = parseInt(document.getElementById("Link Local 10").value)
  
  llMon = parseInt(document.getElementById("Link Local Monthly").value)



  total = document.getElementById("total");

  grandTotal = document.getElementById("grand total");

  sum = a10+ aMon + s10 + sMon + y10 + yMon + l10 + lMon + ll10 + llMon;

  if (sum > 5) {

    updated.value = 0;

    window.alert("Sorry, only five bus passes can be purchased at a time");

    updateSum();

  }

  else {

    total.value = sum;

    grandTotal.value = a10*10 + aMon*42 + s10*5 + sMon*21 + y10*5 + yMon*21 + l10*40 + lMon*125 + ll10*30 + llMon*99 + 1;

  }

}

</script>

 

[trollacious]

First, you need to copy and paste code here directly from the source. In what you have above, you've used Addult but on the website it's Adult.

The problem comes from the dropdown list with the id Adult Monthly. It does not have a value in any of the options.

Lee

 

[BillyRayPreachersSon]

Another major problem is that the IDs have spaces in them.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[AMTK54]

Thanks for the suggestions...I will try and implement them first thing tomorrow and report back.

The text above is a direct copy and paste with the exception of the spelling of 'Adult.' I tried a direct copy and paste and my account became disabled as a result of the site believing I was a spammer of some sort. Tek-Tips suggested I purposely edit the spelling of 'Adult' so the post would work, which is why that appears as such above.

 

[trollacious]

I wasn't sure if the spaces were valid in the IDs or not, didn't bother to check on that detail. I never use spaces in IDs or names, so don't have to worry about that.

If you changed the .value to .text for the document.getElementById() method calls, you should get the results you want, too.

Lee

 

[AMTK54]

Trollacious, I corrected the value issue and the script does now work. Thank you very much for your assistance!