Monday, 1 October 2012

Capitalize first letter of a text field in Dynamics CRM

This was asked on a the Dynamics community forum recently, and due to my struggles in posting Javascript as a response I ended up blogging about it instead!

So how do we do this? Firstly, we'll need a webresource that contains our javascript. Create a .JS file (in my example I'm going to call it test.js) and add the following function to it:

function firstToCaps(obj){
    var fieldVal = obj.getEventSource().getValue();

    var newFieldVal = fieldVal.charAt(0).toUpperCase() + fieldVal.slice(1);
    obj.getEventSource().setValue(newFieldVal);
}

Once you have your JS file saved just add that as a new webresource to your solution.

Next, let's discuss how you hook into an onchange event of a field on a form, because this is what we need to do in order to solve this problem. For this example I'm going to use the account form and the name field.

In our solution let's add the account entity to it. Open up the main form of the account and check out the Form Properties:


You'll notice I have added a library called "crm_tests.js" to the list of Form Libraries. You'll also notice that in the Event Handlers I have selected "Account Name" and "OnChange". This allows me to hook into this event and call a function when required. In my case I have added a call to my function "firstToCaps":


The important part of this event is that I have checked the option to pass the execution context as the first parameter. This gives me access to the field that fired the event.

So, let's go back to that function and take a quick look over what it does:

function firstToCaps(obj){
    var fieldVal = obj.getEventSource().getValue();

    var newFieldVal = fieldVal.charAt(0).toUpperCase() + fieldVal.slice(1);
    obj.getEventSource().setValue(newFieldVal);
}


You've probably put 2 and 2 together at this stage and can see I'm using the execution context "obj" and its function getEventSource to allow me to get and set the value of the calling field.

Save and publish all of that and watch your field auto capitalize!



5 comments:

  1. Hello,

    Great post, really useful. Could you publish some code to capitalise the first letter of every word in a field?

    Many Thanks
    Sam

    ReplyDelete
    Replies
    1. Hi Sam,

      To convert the first letter of every word, also known as title casing I believe, you can simply change the javascript to something like this:

      var newFieldVal = newFieldVal.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});

      I haven't syntax or tested this so apologies if I have made a typo anywhere.

      Conor

      Delete
    2. Apologies about the weird spacing! But hopefully you get the idea

      Delete
  2. try this

    function titleCaseReg(inStr)
    {
    retrun inStr.replace(/^[a-z]/,function(str)
    {
    retrun str.toUpperCase()
    });
    }

    Full Source : Capitalize the first letter

    Ling

    ReplyDelete
  3. how capitalize the all letters while typing

    ReplyDelete