html input text: disable full uppercase digit

Question

In a form I have a simple input text field, where the user insert a title.

<input type="text" name="title_input" id="title_input" value="" />

I do not want that the user can insert a full uppercase digit.

I want to disable digit like this:

LOREM IPSUM DOLOR SIT

Want to enable digit like this:

Lorem ipsum dolor sit
Lorem ipsum 16V dolor C4 sit
Lorem ipsum dolor sit Amet

I already know the ways to convert all the text to lowercase, but isn't what I want.

<input type="text" onkeyup="this.value=this.value.toLowerCase();" name="title_input" id="title_input" value=""  />

or

<input type="text" pattern="[a-z]+" title="only lowercase" name="title_input" id="title_input" value=""  />

If I type "LOREM IPSUM 16V DOLOR C4 SIT" I do not want to convert all the chars to lower case like this:

lorem ipsum 16v dolor c4 sit

But I want to convert into this:

Lorem ipsum 16V dolor C4 sit

I can do this validation with html5 javascript or jquery. How to do that?

--

Thanks Vasil, Is not exactly what I want, but it can be an useful alternative to display error message if the title is full uppercase.

function validateForm() {
    var titleEl = document.getElementById('title_input');
  var title = titleEl.value;
  var upperLength = 0;
  var Ncount = 0;
  var CharCount = 0;

  for (var i = 0; i < title.length; i++) {
    if( isNaN(title[i]) ){
    upperLength += (title[i] === title[i].toUpperCase() ? 1 : 0);
    }else{ Ncount = Ncount + 1; }
  }

  CharCount = title.length - Ncount;

  if (upperLength === CharCount) {
    alert('Invalid title');
    return false;
  }

  return true;
};

And what about words, so check uppercase words?

Wrong title that must return error:

"SELLING iPAD NEW"
"SELLING CITROEN C4 NEW"

May be helpful - http://stackoverflow.com/questions/14106971/forcing-form-text-to-be-lower-case — Hack-R, Nov 07 '16 at 14:59

score 0 · Answer 1 · answered Nov 07 '16 at 15:34

jsfriddle

<form onsubmit="return validateForm()">
  <input type="text" value="" id="title_input" />
  <input type="submit"  />
</form>


<script>
function validateForm() {
    var titleEl = document.getElementById('title_input');
  var title = titleEl.value;
  var upperLength = 0;

  for (var i = 0; i < title.length; i++) {
    upperLength += (title[i] === title[i].toUpperCase() ? 1 : 0);
  }

  if (upperLength === title.length) {
    alert('Invalid title');
    return false;
  }

  return true;
};
</script>

html input text: disable full uppercase digit

1 Answers1