2

I am using a form software that has limited editing capabilities, however allows to add java script. Normally I would like to use PHP for something like this, but in this case i will have to use Javascript, which I have very little experience with.

Essentially on my landing page, I have a form in which people can submit. First Name Last Name Email etc.

the problem is - I mail merge the submissions, and when people enter their name as BOB SMITH or bob smith and not Bob Smith, it makes it look unprofessional when I send them this email. So I would like to add a javascript to this landing page that when the form submits, it converts the strings in the first_name text field and the last_name text field to have the first letter capitalized, and the rest lower case. Another problem is I do not think I can edit the form properties, so if at all possible this javascript would essentially go at the top of the page, and hopefully I dont have to edit the text field properties to activate it...any help would be greatly appreciated.

Thanks

gariepy
  • 3,576
  • 6
  • 21
  • 34
Shane
  • 21
  • 1
  • 1
    name = name[0].toUpperCase() + name.substr(1).toLowerCase(); – Hampus Oct 02 '15 at 21:18
  • Doesn't it look unprofessional when you send mail to Mccoy and O'brien? In any case, if someone wants to write their name in all caps they're unlikely to be bothered when someone else does it too. – JJJ Oct 02 '15 at 21:21
  • Also, you can modify what the user has typed after the submit-button has been pressed with a onSubmitHandler. `document.getElementById('theForm').onsubmit = function() { var firstName = document.getElementById('firstName'); firstName.value = firstName.value[0].toUpperCase() + firstName.value.substr(1).toLowerCase(); };` – Hampus Oct 02 '15 at 21:24
  • Juhana, the unprofessional thing is when someone can't write his Own Name ProPerly :) But this solution decreases the problem by 95%. – dkellner Oct 02 '15 at 21:31
  • See [*Convert first letter to uppercase on input box*](http://stackoverflow.com/questions/14688141/convert-first-letter-to-uppercase-on-input-box). – RobG Oct 02 '15 at 22:21

4 Answers4

1

If you have multiple names / words, this will get them all...

function getProperCase(sText) {
  return sText.replace(
    /([^\W_]+[^\s-]*) */g,
    function(s){
      return s.charAt(0).toUpperCase() + s.substr(1).toLowerCase();
    }
  );
}
WhiteHat
  • 59,912
  • 7
  • 51
  • 133
1

Here is a Javascript Gist for building human-readable names I recently created that does just what you need plus a little extra.

I wont try to explain and instead, here are some examples:

//dan macdonald -> Dan MacDonald [call true]
//dAN mCdOnAlD  -> Dan McDonald [call true]
//paz y MIño    -> Paz y Miño [call true]
//BEN d'hosier  -> Ben D'Hosier
//sara ma'afala -> Sara Ma'afala

Include in your page like so:

<script src="https://gist.github.com/isaacdozier/5ae92c1da9622c77df4c9a70a9f9a849.js">
</script>

Or access the raw file at https://gist.githubusercontent.com/isaacdozier/5ae92c1da9622c77df4c9a70a9f9a849/raw/a81c877e77a3c0c3a795ac40bbf6721950cb2e05/read-names.js

Call the fuction like this:

capsFullName('john SMITH')

which outputs 'John Smith'

OR THIS

capsFullName('sara y gonzalez', true)

which outputs 'Sara y Gonzalez'

note: capsFullName('sara y gonzalez') outputs 'Sara Y Gonzalez'

Community
  • 1
  • 1
Isaac Dozier
  • 86
  • 1
  • 3
0

You could use the function below:

function capitalizeFirstLetter(str) {
    return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
}

It receives a parameter, and returns the first letter uppercased + the rest of your string lowercased.

Buzinas
  • 11,597
  • 2
  • 36
  • 58
Miklós Tusz
  • 167
  • 6
0

I think it's almost like Will P said, but:

function ucFirst(s) {
    return s.substr(0,1).toUpperCase() + s.substr(1).toLowerCase();
}

function camelCase(s) {
    var a=s.split(" ");
    for(var i in a) a[i]=ucFirst(a[i]);
    return a.join(" ");
}

...because you need the last name Cameled too. (And now you can bind this to the change event. Or wherever you see fit.)

According to Will, the final version would look like:

$(function () {
    $("input").on("change", function () {
        $(this).val(camelCase($(this).val()));
    });
});

Hope I didn't mess up the brackets :)

dkellner
  • 8,726
  • 2
  • 49
  • 47