Automate Uppercase Input in text Fields

Tips submitted by PHPMaker users
Post Reply
lUTGARDO

Automate Uppercase Input in text Fields

Post by lUTGARDO »

Due to a Custumer requirement, I needed to fill some Text Fileds Uppercase, no matter if Cap Lock is ON or OFF.
I found this solution, in tree steps.

1.- Add a CSS Stile line.
a.go to PHP Settings->HTML->STYLES
b. Click on "Edit Styles"
c. At the end , below the line /BEGIN_USER_STYLES/ add the following line:
.convertuppercase {text-transform:uppercase}

2.-On Clients Scripts Section choose Global ->Global Code and Add the following function:

function func_convert_uppercase(x) {
x.value = x.value.toUpperCase();
}

  1. Choose the field you want to be Uppercase in your table
    a. In custom attributes write 'class="convertuppercase" onchange="func_convert_uppercase(this)" autocomplete="off" '

NOTE: autocomplete="off" is just to avoid browser´s autocomplete option, because when you are typing a new value, previous typed values for this field are shown in a list.
If you select one of them, the value is saved as is shown , wheter if it is Upper case or Lower Case. (I don´t know Why)

I hope it is usefull for you


jleraj
User
Posts: 11

Post by jleraj »

Thanks

It works for me


wally
User
Posts: 7

Post by wally »

Hi
First of all, thanks lUTGARDO for your post.

How this is related to the same thing, I want to collaborate with another way that I found to do the same thing in one step only.
This way, also will transform the text independently if you will use or not the autocomplete feature, because will transfor all the text once is sent by the browser... ;-)
It resides in adding this line of code to Server Events > Table-Specific > Common > Row_Inserting and Row_Updating

$rsnew["name_of_the_field_to_change"]=mb_strtoupper($rsnew["name_of_the_field_to_change"]);

Hope this will be usefull for others, the same way many times I've found solutions from the others.

Best regards.


Summey
User
Posts: 1
Contact:

Post by Summey »

Perfect thanks Gardo.


yinsw
User
Posts: 140
Location: Penang, Malaysia

Post by yinsw »

I'm putting this under Client side events for the field that I want to be uppercase:

{ // keys = event types, values = handler functions
"change keyup": function(e) {
// Your code
this.value = this.value.toUpperCase();
}
}


GT73
User
Posts: 415

Post by GT73 »

for those who would need the first capital on its own, this could help

Client side events

{ // keys = event types, values = handler functions
	"change": function(e) {
		// Your code
		console.log("UPN:"+this.value);
		var firstLetter = this.value.charAt(0);
		var uppercaseFirstLetter = this.value.charAt(0).toUpperCase();
		var stringWithoutFirstLetter = this.value.slice(1)
		this.value = this.value.charAt(0).toUpperCase() + this.value.slice(1);
		
	}
}

dsingh
User
Posts: 166

Post by dsingh »

Hi Friends..

In order to Uppercase each First Letter of a String i use the following jquery code-

Paste this code in Table Specific Add/Edit Page => Client Script

Just Change <fieldname> with yours :

jQuery(document).ready(function() {
jQuery('#x_<fieldname>').keyup(function() 
{
var str = jQuery('#x_<fieldname>').val();
var spart = str.split(" ");
for ( var i = 0; i < spart.length; i++ )
{
var j = spart[i].charAt(0).toUpperCase();
spart[i] = j + spart[i].substr(1);
}
jQuery('#x_<fieldname>').val(spart.join(" "));
});
});

gagupta
User
Posts: 20

Post by gagupta »

Thanks


DalasInggrid
User
Posts: 3

Post by DalasInggrid »

Hallo gardo

where do i apply the costum attribute ? is it in custom attribute div / Hyper Custom Attribute
because a double quote or single quote error appears


mobhar
User
Posts: 11660

Post by mobhar »

DalasInggrid wrote:

because a double quote or single quote error appears

You may post your code for more discussion.


arbei
User
Posts: 9286

Post by arbei »

It is not Custom Attributes, they were Client Side Event or Client Script, as said by the users above.


DalasInggrid
User
Posts: 3

Post by DalasInggrid »

then where do I put the following script?
class="convertuppercase" onchange="func_convert_uppercase(this)" autocomplete="off" '


mobhar
User
Posts: 11660

Post by mobhar »

To add css class into your field, then you may use Row_Rendered server event, for example (adjust FieldName to your actual field name), for example:

$this->FieldName->CellAttrs["class"] = "convertuppercase";

To add onchange event into your field, then you may put this following code in the same event above, for example:

$this->FieldName->EditAttrs["onchange"] = "func_convert_uppercase(this);";


Post Reply