Forum Moderators: open
3 input boxes. In overall these 3 boxes HAS to be 100.
I tried doing some scripting (I am so novice in javascripting), but this is what I came up with so far:
<script type="text/javascript">
function validate()
{
var Temp1=document.getElementById(el).value.
var Temp2=document.getElementById(el).value
var Temp3=document.getElementById(el).value
var Temp4=Temp1+Temp2+Temp3;
submitOK="true"
if (temp4.value <> 100)
{
alert("The overall result has to be 100%.")
submitOK="false"
}
if (temp1.value<0 ¦¦ temp1.value>100)
{
alert("The temperature must be between 0 and 100.")
submitOK="false"
}
if (temp2.value<0 ¦¦ temp2.value>100)
{
alert("The temperature must be between 0 and 100.")
submitOK="false"
}
if (temp3.value<0 ¦¦ temp3.value>100)
{
alert("The temperature must be between 0 and 100.")
submitOK="false"
}
if (submitOK=="false")
{
alert("There was an error. Most likely due to the overall temperature not being 100°.")
return false
}
}
It doesn't work which you may se, but what is wrong or what do I miss?
Any tips are well appreciated.
TIA
The values of the inputs are strings, so adding them up will only concatenate them
- alert the value of Temp4 to see this.
The simplest conversion is to multiply by 1
Temp1=(document.getElementById(el).value*1)¦¦0
The ¦¦0 allows for the case where the box is empty, or contains a non-numeric string. In this case the value on conversuion will be NaN, and the default value, zero, is used instead.
Validating onkeypress seems a bit much. You'll be telling them it's invalid before they get a chance to put much in.
When adding the var in the head-section, it's done by this now:
var Temp1=(document.getElementById(el).value*1)¦¦0
Also
var Temp2=(document.GetelementById(el).value*1)¦¦0
etc etc.
I thought about the onkeypress, and I came to think that onblur might be better? -
It is in a massive page, where you have to type in all sorts of numbers, clicking out things and then in the end submit it to page two, where some calculations are done.
You are using getElementById, but you are passing a name. This may work in IE, but it won't work in other browsers.
The validate function takes no argument..
function validate()
{
var Temp1=document.getElementById(el).value.
...
Where is the variable, el, declared and defined?
about (el) I'm not entirely sure. Obviously leaving it () also seems more logical to me, but I copy / pasted a bit from something else I made work last night.
So if;
<div id="test">
<input ... bla bla >
</div>
Then GetElementById would work fine, I think.
As an example of how the (el) worked, I can show you another thing I made, hide/show visibility of some Divs'.
<script>
function ToggleVisibility(el)
{
if( document.getElementById(el).style.visibility!= 'hidden' )
document.getElementById(el).style.visibility = 'hidden';
else
document.getElementById(el).style.visibility = 'visible';
}
function HideVisibility(el)
{
document.getElementById(el).style.visibility = 'hidden';
}
function ShowVisibility(el)
{
document.getElementById(el).style.visibility = 'visible';
}
</script>
var Temp1=document.getElementById(el).value
var Temp2=document.getElementById(el).value
var Temp3=document.getElementById(el).value
Even if you had defined el somewhere, and it was an element id, then this would still reference the same element 3 times.
Sorry for these questions that might seem quite simple to you, but as stated in my first post I'm kind of new to this. (which obviously figures).
:)
