Javascript Newbie Needs Help Please

[davidjwest]

Hi,

I've got the following javascript, works fine in Firefox, Chrome, Safari but not IE:

<script type="text/javascript">

function optionValue(e, i) { var ov; ov = document.getElementById(e).options[i].value; return ov; }
function optionText(e, i) { var ot; ot = document.getElementById(e).options[i].text; return ot; }
function getCost(e, i)
{
  var a; var b; var c; var d; var cost;

  a = optionValue(e, i);
  b = optionText(e, i);

  c = a.length;
  c = Number(c);
  d = b.length;
  d = Number(d);

  cost = b.substring((c + 3), (d - 2));

  return cost;
}

function recalc()
{
  var start; var idx; var cost1; var cost2; var cost3; var costA; var costE; var costC; var total; var output; var driv1; var driv2; var driv3;

start=<?php echo $cash; ?>

  idx = document.getElementById("driver1").selectedIndex;
  driv1 = optionValue("driver1", idx);
  cost1 = getCost("driver1", idx);

  idx = document.getElementById("driver2").selectedIndex;
  driv2 = optionValue("driver1", idx);
  cost2 = getCost("driver2", idx);

  idx = document.getElementById("driver3").selectedIndex;
  driv3 = optionValue("driver1", idx);
  cost3 = getCost("driver3", idx);

  idx = document.getElementById("aero").selectedIndex;
  costA = getCost("aero", idx);

  idx = document.getElementById("engine").selectedIndex;
  costE = getCost("engine", idx);

  idx = document.getElementById("chassis").selectedIndex;
  costC = getCost("chassis", idx);

  output = start - (Number(cost1) + Number(cost2) + Number(cost3) + Number(costA) + Number(costE) + Number(costC));

  var btn = document.getElementById("submit");

  if (output >= 0)
  {
    spanclass = "under";

    if (driv1 == driv2 || driv1 == driv3 || driv2 == driv3)
    {
      document.getElementById("status").innerHTML = "Cannot select the same driver more than once!";
      btn.disabled = true;
    } else {
      document.getElementById("status").innerHTML = "";
      btn.disabled = false;
    }
  } else {
    if (driv1 == driv2 || driv1 == driv3 || driv2 == driv3)
    {
      document.getElementById("status").innerHTML = "Cannot select the same driver more than once!";
    } else {
      document.getElementById("status").innerHTML = "";
    }
    spanclass = "over";
    btn.disabled = true;
}

var output = output.toFixed(1);

  document.getElementById("budget").innerHTML = "Remaining Budget: <span class=\"" + spanclass + "\">&pound;" + output + " M</span>";
}
</script>

I'd be very grateful if anyone can tell me what I did wrong, thanks!

[JAB Creations]

The fact that it works in Firefox, Opera and Safari and not IE means you wrote it correctly the first time. Use IE8/9's developer tools to debug the script and where it fails you'll want to find the method or proprietary Internet Explorer property that is equivalent to the standards compliant method or property.

Also do not use innerHTML, it's the equivalent of handing a queen her crown by throwing it like a football at her face. Look up "JavaScript DOM methods" and if you end up at the site of Mark "Tarquin" Wilton-Jones then you're in the right place.

- John

[dbarasuk]

For someone who has used gmail.com, what i mean is like when someone clicks the "Add More Files" when attaching files. If you click that button one sees a list of file input under on his email page.

[dbarasuk]

sorry