I have a problem with IE. I created form with calculation in JS it use input type range. here is a link to jsfiddle: / And html code:

<form action="" method="post" name="checkine">
<label>Persons</label>
<input id="persons" name="persons" type="range" min="1" max="41" value="10" oninput="chckIne();" />
<p id="personsvalue">10</p>
<br />
<label title="">Sale per person</label>
<input id="starters" name="starters" type="range" value="21.2" min="0.0" max="100.0" step="5" oninput="chckIne();" />
<p id="startersvalue">21</p>
<br />
<p id="resultsvalue"></p>
<p style="text-align:center; padding-top:10px;">
    <input name="Reset" class="btn btn-large" type="reset" value="Reset" />
</p>

Javascript:

function chckIne() {
var price = 49.9;
var regular = 199.9;
var form = document.forms.checkine;
var x = parseFloat(form.persons.value);
var y = parseFloat(form.starters.value);
var z = 2.5;
var sum1 = (x * y) * price;
var sum2 = ((x * y) * z) * regular;
var sum3 = ((sum1 + sum2) * 0.25).toFixed(0);
sum3 = sum3.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
document.getElementById('personsvalue').innerHTML = form.persons.value;
document.getElementById('startersvalue').innerHTML = form.starters.value;
document.getElementById('resultsvalue').innerHTML = sum3 + " kr";
}

It works in all browsers except IE. Can someone have idea how to fix it?

I have a problem with IE. I created form with calculation in JS it use input type range. here is a link to jsfiddle: http://jsfiddle/vu378xh9/8/ And html code:

<form action="" method="post" name="checkine">
<label>Persons</label>
<input id="persons" name="persons" type="range" min="1" max="41" value="10" oninput="chckIne();" />
<p id="personsvalue">10</p>
<br />
<label title="">Sale per person</label>
<input id="starters" name="starters" type="range" value="21.2" min="0.0" max="100.0" step="5" oninput="chckIne();" />
<p id="startersvalue">21</p>
<br />
<p id="resultsvalue"></p>
<p style="text-align:center; padding-top:10px;">
    <input name="Reset" class="btn btn-large" type="reset" value="Reset" />
</p>

Javascript:

function chckIne() {
var price = 49.9;
var regular = 199.9;
var form = document.forms.checkine;
var x = parseFloat(form.persons.value);
var y = parseFloat(form.starters.value);
var z = 2.5;
var sum1 = (x * y) * price;
var sum2 = ((x * y) * z) * regular;
var sum3 = ((sum1 + sum2) * 0.25).toFixed(0);
sum3 = sum3.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
document.getElementById('personsvalue').innerHTML = form.persons.value;
document.getElementById('startersvalue').innerHTML = form.starters.value;
document.getElementById('resultsvalue').innerHTML = sum3 + " kr";
}

It works in all browsers except IE. Can someone have idea how to fix it?

• javascript
• internet-explorer

• 1 oninput is only supported from IE9 onwards. You can use onkeyup instead on older browsers. – Frédéric Hamidi Commented Sep 19, 2014 at 8:31
• funny thing - I tried on IE 11. The same. MaxArt solution works great. – gzres Commented Sep 19, 2014 at 8:42

1 Answer 1

oninput is not supported in older Internet Explorer versions. Since oninput triggers when you make input you could use other events to do pretty much the same thing.

Since you are using range I would suggest to use onmousemove.

<input type="range" id="testInput" onmousemove="test()">

<p id="demo"></p>

<script>
   function test() {
      var x = document.getElementById("testInput").value;
      document.getElementById("demo").innerHTML =  x;
   }
</script>