You are viewing limited content. For full access, please sign in.

Discussion

Discussion

Central JavaScript Code to Transform Text in Designer Mode

posted on March 11 Show version history

To this point, I’ve noticed there are only a couple of ways, in Designer Mode, to mass convert field text to upper or lower case:

Option 1:
.upperCase input {text-transform: uppercase;}
.lowerCase input {text-transform: lowercase;}

With this option (which we’ve been using to this point), this converts the field value to upper or lower case on the screen, however the actual typed value does not actually convert (and therefore carry through the process upon submission).  The nice thing about this approach is that, as in Classic Mode, we could reference one central set of code under the JavaScript tab of the form, but this code is only of value on the front end, not the back.

Option 2:
LFForm.onFieldBlur(function () { LFForm.setFieldValues({fieldId: 1}, LFForm.getFieldValues({fieldId: 1}).toUpperCase());}, {fieldId: 1});

With this option, this will convert the field value to upper or lower case, and the actual typed value does convert, however we need to do this conversion on a field-by-field basis, instead of specifying “upperCase” on the field to reference a central set of code (which takes quite a bit of time to implement on each individual form).

I wonder if there might be any code you may have heard of that could 1) Be specified in the JavaScript section of the form, and 2) Transform the text that carries through the form process, and then to the Save to Repository step (and indirectly, the Instance Name)?

Our reseller had suggested using the External tab, under JavaScript in Designer Mode, to reference one central set of code, but saving our code to one central file, and then referencing this under the External tab, didn't look to accomplish anything either.

Thanks to any of you who might have some suggestions for code that will transform text to upper case in one central set of code, similar to what we were able to accomplish in Classic Mode previously!

Marty Gaffney
Town of Okotoks

0 0
replied on March 11
  1. Using an external script is a great idea if you want to share this code among many forms
  2. External script requires your code to be written generically meaning, without any understanding of field identification variables. you can do one of the following
    1. Define a function that takes a field or fields and sets the event handlers on them
      1. Define the function on the window and call this function from the inline script section passing relevant form fields
    2. Use a class on fields in the form designer and use LFForm.findFieldsByClassName to find all relevant fields and invoke your function for all fields automatically

Just a heads up, when you are iterating across fields to setup your handlers I would check the component type of the field. your function will only work on single line/multi line text fields so you can be a little "smart" about how you define the function. And of course, make sure you handle/report errors so people who use the script can debug why it isn't working.

2 0
You are not allowed to follow up in this post.

Sign in to reply to this post.