handling number format and precision exceptions in jsp

Question

the following is the code for adding a new fund wher min_holdings and nav are int values wheres all other are varchar and text fields.. While entering those fields i wanna make sure that correct formats are entered by user like int in int and not char or string in int.. if so an alert box should come .. how to do that???!!!

 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
 <title>Insert title here</title>
 </head>
 <body>
 <form method="post" action="AddMF">
 <center>
 <table>
 <tr>    
 <td>Fund Code</td><td><input type="text" name="mf_code"></td>
 </tr>
 <tr>
 <td>Name</td><td><input type="text" name="mf_name"></td>
 </tr>
 <tr>
 <td>Fund Type</td><td><input type="text" name="mf_type"></td>
 </tr>
 <tr>
 <td>Current NAV</td><td><input type="text" name="nav"></td>
 </tr>
 <tr>
 <td>Minimum Holdings</td><td><input type="text" name="mf_min_holdings"></td>
 </tr>
 <tr>
 <td>Description</td><td><input type="text" name="mf_description"></td>
 </tr>
 <tr>
 <td>Termd and Conditions</td><td> <input type="text" name="mf_TandC"></td>
 </tr>

 </table>

 <br>
 <input type="submit" value="submit">
 </center>
 </form>


 </body>
 </html>

The eternal question remains: _"What have you tried?"_ (along with other questions like ``? really?) — Elias Van Ootegem, Jun 10 '13 at 10:38
i havent tried anything yet... i dint get an idea.. how to ensure that int is entered for int and not string.... yes table... really — APPU cool, Jun 10 '13 at 10:41
Let me know if the answer I provided helped you, or if anything is still unclear. I've written quite a lot of JS, so I sometimes assume things are self-explanatory when in fact they're not — Elias Van Ootegem, Jun 10 '13 at 11:12

score 0 · Answer 1 · answered Jun 10 '13 at 10:40

0

You can use JQuery Validation plugin.. This will help:

http://jqueryvalidation.org/

answered Jun 10 '13 at 10:40

Pranav Kale

629
1
5
13

Where did you see the jQuery tag? Please don't just assume jQ, not everybody uses it – Elias Van Ootegem Jun 10 '13 at 10:42
thats a plugin... is ther no other way? – APPU cool Jun 10 '13 at 10:43
Elias Van Ootegem ... can u help? – APPU cool Jun 10 '13 at 10:44

score 0 · Accepted Answer · answered Jun 10 '13 at 10:58

Give your form an id, say frmId:

<form id='frmId' method='post' action='AddMF'>

Then, add the following JS:

//assuming window.onload or something
document.getElementById('frmId').onsubmit = function(e)
{
    e = e || window.event;
    var inputs = this.elements,
    i, val;
    for (i=0;i<inputs.length;i++)
    {
        if (inputs[i].value.trim() == +(inputs[i].value.trim()) && inputs[i].value.trim().length > 0)
        {//trim value, continue
            inputs[i].value = inputs[i].value.trim();
            continue;
        }
        alert('Expected numeric input, saw: "' + inputs[i].value +'"');
        //stop submitting the form
        if (e.preventDefault)
        {
            e.preventDefault();
            e.stopPropagation();
        }
        e.returnValue = false;
        e.cancelBubble = true;
        return false;
    }
};

Now, the code above assumes all inputs should be numeric. You can specify what type of input you are expecting by use of a class or even the id/name of the various input elements.
Just to show you what ways I'm checking the input:

inputs[i].value.trim()//strip all trailing and leading spaces from input
  == +(inputs[i].value.trim())//loose comparison to the same value, coerced to a number

this equates to:

'1' == 1 or 'a' == 0

If the user entered a, this will equate to false, if the input was numeric, it'll be true. If there is no input, the comparison equates to:

'' == 0

Which is true, that's why I added: && inputs[i].value.trim().length > 0, to ensure the input value is at least one char long.

If you want to check for alfanumeric inputs, you can use regex's like this:

inputs[i].value.test(/^[a-z]+$/i)//only chars from a to z, case insensitive

And so on, and so forth... but explaining regexes is not something that can be easily done here, just google "regex javascript" and learn to love them... then love to hate them, too :)

not working :( no errors but the alert box is not being displayed :(\ — APPU cool, Jun 10 '13 at 11:28
its not working... I dont see any reason y it shouldnt work.. but the alret box just wont pop!!!! — APPU cool, Jun 10 '13 at 11:31
@APPUcool: Have you wrapped the code up in an `onload` handler? and does your form element have the same ID (case-Sensitive, mind you). Also: if the input is correct, there won't be an alert, obviously. You must test this with deliberate false input — Elias Van Ootegem, Jun 10 '13 at 11:53
I gave deliberate wrong input yes.. i used onsubmit yes same id! — APPU cool, Jun 10 '13 at 13:55
Sounds to me like you've not used the `[on]load` event, because I tried this code [copy pasted in this fiddle](http://jsfiddle.net/BaYeQ/) and it works like a charm (using chrome) — Elias Van Ootegem, Jun 10 '13 at 14:20
@APPUcool: If the weird event handling looks daunting, [I've posted this question here](http://stackoverflow.com/questions/11186750/memory-leak-risk-in-javascript-closures) which explains why I attach listeners and unbind them in the callbacks again: it's to avoid any chance of mem-leaks on the global object... mainly for older versions of IE. BTW, I don't like to be a rep-whore, but generally if somebody helps you, or answers your question, the SO way to say thanks is to up-vote & accept the answer. If it's your question, you can vote regardless of your reputation — Elias Van Ootegem, Jun 10 '13 at 14:22

handling number format and precision exceptions in jsp

2 Answers2