0

Hello. I need help with my javascript code.. In the screenshot I just uploaded here, When I input a non-numerical character on the 1st box, it should make the 2nd text box output 0 instead of NaN.

    <form method="POST"> <!-- my html form... for clarity sake -->
        <p><span id="errMsg" class="errMsg"></span></p>
        <p><label>Value: </label>
        <input type="text" id="convertNumberOne" oninput="x()" placeholder="0.00"> 
        </p>
        <p><label>
        <select id="unitNumberOne" onchange="x()">
        <option value="hrs">Hours (hr)</option>
        <option value="min">Minutes (min)</option>
        <option value="sec">Seconds (s)</option>
        <option value="msec">Miliseconds (ms)</option>
        <option value="usec">Microseconds (&#956;s)</option>
        <option value="nsec">Nanoseconds (ns)</option>
        </select> 
        to </label>
        <select id="unitNumberTwo" onchange="x()">
        <option value="hrs">Hours</option>
        <option value="min">Minutes</option>
        <option value="sec">Seconds</option>
        <option value="msec">Miliseconds</option>
        <option value="usec">Microseconds (&#956;s)</option>
        <option value="nsec">Nanoseconds (ns)</option>
        </select></p>
        <p>
        <label>Result:</label> 
        <input type="text" id="convertNumberTwo" placeholder="0.00" readonly></p>




function x() // the convertNumberOnetoNumberTwo is a function that I didn't include here since I thought                  //its not important to view. It is just for the computation part
{
    //values from the HTML form 
    var getUnitNumberOne = document.getElementById('unitNumberOne').value;
    var getUnitNumberTwo = document.getElementById('unitNumberTwo').value;
    var getNumberOne = document.getElementById('convertNumberOne').value;   
    validateNumberOne(getNumberOne); 
    var b = parseFloat(convertNumberOnetoNumberTwo(getUnitNumberOne, getUnitNumberTwo, getNumberOne));
    if( b < 1.0 && b > Math.pow(10,-3) )
    { b= b.toPrecision(4)}
    else if (b < Math.pow(10,-3))
    {
        b = b.toPrecision(6);
    }

    document.getElementById('convertNumberTwo').value= "" + b;

}   

function validateNumberOne(a) // check if entered data in convertNumberOne is correct
{
    try
    {
        if(Number(a) || a == "") throw "";
        if(isNaN(a)) throw "Only Numbers can be entered!";
        a == Number(a);

    }
    catch(err)
    {
        document.getElementById('errMsg').style.color= "red";
        document.getElementById('errMsg').innerHTML= err;

    }
}

So my aim here is to just let the 2nd text box compute for numerical characters otherwise, it should not compute burt rather display 0 than NaN

Attachments help_js.png 77.41 KB
3
Contributors
3
Replies
15
Views
2 Years
Discussion Span
Last Post by stbuchok
1

To check if a var is a number you should use

if ( Number(a) === a ) {
    // It's a number!
}
else {
    // It's not a number
}

Another detail, in you validateNumber function you may throw an error, but you are not handling that error when you call the validateNumber function.
You should put in a try{} catch{} and set the number 0 if there's an error.

0

Correct me if I'm wrong but I believe this way is faster:

if(+a === a){
    //do something
}
else{
    //do something else
}
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.