Set Text Focus On Perspective module

Ignition
, ,
1

image
image781×386 41.1 KB 

self.getSibling("ScanWO").focus()

I have try to use the focus scripting in the perspective.
image
current situation is when I clike the button , it will add the data after the previous data
image

What I want is if I click the button , the previous text will become blue
image
then the new data can replace the old data( I use Scanner as input)

this is very easy in vision , but I don’t know how to make it works in perspective.
Thanks a lot

2

It doesn’t seem to be programmable at the moment. See Perspective TextField SelectAll OnFocus. You could use the button script to set the text to “”.

3

noted and thanks

4

You could ‘css hack’ it:
Create a new style, call it highlight-text, then in one its field (for example the background image), paste this: }.psc-highlight-text::first-line { background-color: blue;}{ (replace blue by whatever color you need/want)
Now, add the highlight-text class to your input field on your button’s actionPerformed event script to enable the effect, and remove it + delete the text when you get your new data.

edit:
You can also put that css bit, without the first and last brackets, in a custom theme file. You’ll still need to create the style class. Make sure the names match, with the psc- prefix in your css selector.

1 Like
5

image
image998×1368 95.1 KB

image
image796×234 35.8 KB

upside is my understanding of your part explain I first adjust the component ScanWO, but I don’t know the following word how to handle

Now, add the highlight-text class to your input field on your button’s actionPerformed event script to enable the effect, and remove it + delete the text when you get your new data.

image
image1278×526 107 KB

can you show me some picture , thanks a lot

6

You forgot the }{ in your css: }.psc-highlight-text::first-line { background-color: blue;}{

image
image703×321 16.4 KB

You need to start with a closing bracket and end with an opening bracket, to inject css. Yes, it’s not pretty.
OR
You use .psc-highlight-text::first-line { background-color: blue;} without the brackets, in the theme css file (something like /usr/local/bin/ignition/data/modules/perspective/themes/your_theme.css)

Then, in your button’s onActionPerformed event, add something like this:

classes = self.getSibling("TextField").props.style.classes.split(' ')
classes = set(classes) | set(["highlight-text"])
self.getSibling("TextField").props.style.classes = ' '.join(classes)

Then, when you need to replace the data in the text field,
do the opposite:

classes = self.getSibling("TextField").props.style.classes.split(' ')
classes = set(classes) - set(["highlight-text"])
self.getSibling("TextField").props.style.classes = ' '.join(classes)
2 Likes
7

it works for the color change, thanks a lot