3.5.6: Show bgcolor for field that gains focus

Classic Servoy
1

Hello,

Is there a possibility to change the bgcolor for a field that gets the focus?

My customer would like to have the field that has the focus to have a different background color, so make it very visible what field needs to be entered.

SelectOnEnter setting is not enough, because it doesn’t show anything when field is empty , because it selects only the data.

And adding a method for each field on each form isn’t a solution as well.

It would be great to have some setting like this:

application.setFieldFocusGainedBGColor('#ffcc66')

or

form.myForm.controller.setFieldFocusGainedBGColor('#ffcc66')

Servoy must handle that the BGColor is shown and when focus is lost the default BGColor must be shown again.

Is that possible or is there someone who has another solution for this?

Martin

2

You can already do that.

You have the onFocusGained and onFocusLost events for a field.

Next thing you can do is in the methods you attach:

forms.formname.elements.elementname.bgcolor = "#NEWCOLOR";
3

And adding a method for each field on each form isn’t a solution as well.

Oops, did not read that.
The Decorator Plug-in can do that for borders (http://www.it2be.com/plugins.htm#decorator).
I am pretty sure we can add background colors to it.

4

Wrong again, the Decorator Plug-in already does it for background and foreground as well (forgot about that).

5

Hi Martin,

You can do this by using an onFocusGained and onFocusLost method on your fields.
Here are 2 examples of global methods you could use in your forms. Just attach them to the fields you want to change color.

onFocusGained method:

var sElement = application.getMethodTriggerElementName();
var sForm = application.getMethodFormName();
if ( sElement ) {
	forms[sForm].elements[sElement].bgcolor = '#ffcc66'; // show focus color
}

onFocusLost method:

var sElement = application.getMethodTriggerElementName();
var sForm = application.getMethodFormName();
if ( sElement ) {
	forms[sForm].elements[sElement].bgcolor = '#ffffff'; // set to white
}

You do need to fill in the name property of the fields though or else it won’t work.

Hope this helps.

6

Wow, I am slow. :shock: Marcel does 3 posts before I even get 1 post out the door…

7

You just missed one part of my post (like Marcel did :-) )

And adding a method for each field on each form isn’t a solution as well.

8

martinh:
You just missed one part of my post (like Marcel did :-) )

And adding a method for each field on each form isn’t a solution as well.

Robert’s tip is only two methods for your whole solution. We use a version of the same technique to move a border box around to highlight each field. Works quite well. Not sure why it isn’t a solution to your task…

Picture 60.png
Picture 60.png564×238 11.7 KB

9

Roberts tip was to add this method to each field on my form (even it is the same method that is being called)

You can do this by using an onFocusGained and onFocusLost method on your fields.
Here are 2 examples of global methods you could use in your forms. Just attach them to the fields you want to change color.

For a solution with thousands fields that is not a solution. And programmer would forget also to attach this method to fields.

That is why I need a general solution

10

Well, someone had to create all those fields to begin with. Get that person to do the job for you… :)

Actually, there is a much faster way than going one-by-one. Select one field, then “Select All”. This will select all the fields on a form. Attach two global methods – you’re done.