Capitalizing first letters in JavaScript

Question

I have a problem here. I just started learning with Yii2 and I need to capitalize first letters of my entry form (it's name and surname). I'm doing this with JS, but somehow my code does not work and it didn't printing any results. Could someone help me to solve this problem and tell me what I'm doing wrong?

Here is my code:

function entryForm(name, surname) {
this.name = $(name);
this.surname = $(surname);
var self = this;

/*
* Capitalizes first letter of users entered name and surname
*
* @param string input
*/
this.capitalizeName = function(input) {
var name = input.val();
name = name.toLowerCase().replace(/(^|\s)[a-z]/g, function(letter) {
    return letter.toUpperCase();
})
input.val(name);
}
var entryForm = new entryForm('#employee-name', '#employee-surname');

$(document).ready(function() {
/*
* Executes named function
*/
    $('#employee-name, #employee-surname').change(function() {
        entryForm.capitalizeName($(this));
     })
 })
}

You can use solution from stackoverflow.com/questions/1026069/… — Bizley
– Bizley, Commented Apr 5, 2017 at 10:17
Do you need to display the 'capitalized' text or it is not necessary (it is enough that it is stored in the DB that way)? — gmc
– gmc, Commented Apr 5, 2017 at 10:18
@gmc I need to automatically display enterted name with uppercase letter. Yes, I could do this with the model, by adding the rule, but instead of auto-replacing it would replace the letters after clicking "Create" button — user7435747
– user7435747, Commented Apr 5, 2017 at 10:20
@Bizley Somehow my code has to work, because it already worked when I did the same task without Yii, just only by using OOP — user7435747
– user7435747, Commented Apr 5, 2017 at 10:21

gmc · Accepted Answer · 2017-04-05 10:47:26Z

I'd made a couple adjustments that I think I'd make it work:

First, name your js 'class' starting with an uppercase. This variable declaration var entryForm = new entryForm( shadows the previous declaration of the 'class' with the same name.

Second, I'd put the $(document).ready function outside of the class.

function EntryForm(name, surname) {
    this.name = $(name);
    this.surname = $(surname);
    var self = this;

    /*
    * Capitalizes first letter of users entered name and surname
    *
    * @param string input
    */
    this.capitalizeName = function(input) {
        var name = input.val();
        name = name.toLowerCase().replace(/(^|\s)[a-z]/g, function(letter) {
            return letter.toUpperCase();
        })
        input.val(name);
    }   
}

$(document).ready(function() {
/*
* Executes named function
*/
    $('#employee-name, #employee-surname').change(function() {
        var entryForm = new EntryForm('#employee-name', '#employee-surname');
        entryForm.capitalizeName($(this));
     })

 })

Collectives™ on Stack Overflow

Capitalizing first letters in JavaScript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related