Validating form fields

Hi a bit of a newbie here hoping someone will save me

I have a form which has a calculate button - on pressing this button it performs a simple check on entered fields and either posts the proper value or a message relating to the field error.

This all works perfectly except for one field that I can't get to work.

I want to say if field 'os7' is not all uppercase letters post message to field 'calcprice' "ID Invalid"

I am something of a novice so please excuse me

This is what I have tried which doesn't work

if(form.os7.value != (/^[A-Za-z]+$/)) {return form.calcprice.value = "ID Invalid"; }

I have used very similar on the other fields but the value has been specific so I'm wondering if maybe the punctuation or the value in brackets is to blame because this one works fine:

if (form.os2.value == "Y" || form.os2.value == "Z" || form.os2.value == "Za") {return form.calcprice.value = "Sorry prices on application"; }

looking forward to your response

Thank you

 

Did you try something as simple as text-transform?

Simply add this to that input field:

style="text-transform: uppercase"

Code (markup):

https://jsfiddle.net/twnLfmjz/10/

Or put this in your .CSS file. Change #name to the id of your input field that requires the letters to be capitalized:

#name {
  text-transform: uppercase;
}

Code (markup):

https://jsfiddle.net/twnLfmjz/9/

 

Hi
Yes I have that in place but it can be overridden with copy and paste and it doesn't stop numbers.

 

This is in jquery. Maybe someone can come up with something similar in javascript. It works though. Change .lettersonly to your own class:

http://jsfiddle.net/HwTEj/387/

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script>
$(function() {
    $('.lettersonly').keyup(function() {
        this.value = this.value.toUpperCase();
    });
});

$(".lettersonly").on("input", function(){
  var regexp = /[^a-zA-Z]/g;
  if($(this).val().match(regexp)){
    $(this).val( $(this).val().replace(regexp,'') );
  }
});
</script>

Code (markup):

 

OK thank you for your answers but maybe I wasn't being completely clear - I understand all the above and have the field working perfectly - people can only enter uppercase letters.
My problem is that they can over-ride this by copy / pasting into the field if they chose - which, trust me, they will try

so.. I have a script that runs that checks all the different fields validity when a button is pressed - and they will press it because it calculates price if all the fields are entered correctly.

In this script I want it to say if field os7 is not just uppercase letters (no numbers) then {return form.calcprice.value = "ID Invalid"; }

As my initial post shows this method works fine for all the other fields - it's just this one I can't work out the syntax for.

My script starts like this:-

function CalculateBasic(form) {
"use strict";

if (form.os2.value == "Y" || form.os2.value == "Z" || form.os2.value == "Za") {return form.calcprice.value = "Sorry prices on application"; }
if ((form.os0.value == "Plain closed" || form.os0.value == "Black filled closed" || form.os0.value == "Plain split" || form.os0.value == "Black filled split") && form.os1.value != "Plain") {return form.calcprice.value = "colours not available with these options"; }
if ((form.os0.value == "Anodised split") && form.os1.value == "Plain" ) {return form.calcprice.value = "Please choose colour"; }

lots in the middle ........ and ends

if (form.os0.value == "Black filled split" && form.os3.value == (40) ) {return form.calcprice.value = "27.00"; }
if (form.os0.value == "Black filled split" && form.os3.value == (50) ) {return form.calcprice.value = "32.48"; }

return true ;
}

 

They can't override that jquery solution by copying and pasting. Looks like you didn't test that jsfiddle I gave you there. The only way they can do that is by disabling javascript in their browsers. But then, probably, neither of your solutions will stop them from doing whatever they want.

I understand you're trying to create an error message after the fact, personally, I think you need to ensure that they can only enter the right thing from the get-go.

 

Try this

if (!/^[A-Z]*$/g.test(form.os7.value)) {return form.calcprice.value = "ID Invalid"; }    

Code (JavaScript):

Modified from here: http://stackoverflow.com/questions/...input-field-accept-only-letters-in-javascript

 

Thank you for this - I did look however I considered that maybe it would be easier to handle if it were all kept within the same js file as just a set of validation instructions - I'm a bit of a novice and integrating these things in has already caused me a few headaches so far and not been successful. I can see me getting an a pickle if I ever need to modify :/ I will use this if no other solution can be found

Thank you for this however whatever is entered seems to come up with ID invalid?

 

I set up a test form here and it seems to work: https://jsfiddle.net/ujggz7r9/1/
Perhaps post all your code including the form (in code tags for ease of reading).

 

Hi - I'm sure this is easy but I have absolutely no idea how to do it - I posted over your jsfiddle and nothing works at all so I guess I'm being a complete numpty
I am happy to share what I have to reach a solution but I don't know how

 

In the code that you say you have now, that doesn't work (this one: if(form.os7.value != (/^[A-Za-z]+$/)) {return form.calcprice.value = "ID Invalid"; }) - have you tried just changing A-Za-z to A-Z? That should only allow upper-case

 

Hi and thanks all for your efforts - I tried everything and failed miserably - have now solved it by simply preventing 'paste' in that field so letters and uppercase works - final validation therefore not necessary since it cannot be pasted into