I’m working in Ignition Perspective and want to implement a “search help” type of feature for certain input fields:
Users cannot type directly in the field (i.e., it should be effectively read-only).
When the user clicks on the field, a popup appears with a table or list so they can pick a record.
After selecting a row, the chosen value is placed into the field automatically.
tried setting the input’s enabled=false and placing a separate button next to it to trigger the popup, but the result isn’t very clean:
The disabled field looks grayed out and unattractive.
The button is small, so even I find myself accidentally clicking the input area instead of the button—it’s not a natural interaction.
I’m curious if there’s a “standard” or “best practice” approach for this scenario. Has anyone tackled a similar use case (no direct typing, but a selection popup) and found a clean solution? Which method do you recommend?
Thanks in advance for any suggestions or insights!
You have effectively described a dropdown component. Use that with allowCustomObjects set to false, and search disabled. That will prevent them from being able to type something in.
Thanks. But in my case, I need to show more than one piece of information per option — for example:
• Username
• First name
• Last name
• Maybe department or title too
So it’s more like a record selection than a single-value pick. Dropdown only shows one label per row (e.g., label), which is limiting.
That’s why I’m exploring alternatives like using a popup with a table or a list, where I can show multiple columns and let the user choose a row.
You’re right — technically I can combine multiple values into the dropdown label field using something like:
"jsmith - John Smith (Sales Dept)"
But visually, it’s not very clean, especially when dealing with longer names or multiple fields. It quickly becomes hard to scan or compare rows, particularly on smaller screens.
I’m thinking of just using a Label component, styling it to look like an input field (with borders, background, padding, etc.), and making it clickable to open the popup. It seems to be the cleanest solution for now, since it avoids user input, looks like a field, and is easy to manage.
Well it's always gonna be a hack, that's what web development is made of. mostly.
I have just one advice though: Don't waste your breath trying to make the whole thing look like a dropdown.
If you're gonna use a popup, embrace it, and just go the popup route all the way. It's usually better to rethink your design to make it fit the components you're using. It makes for a better user experience, as the components used match what they're used to, and for a better dev experience as you're not trying to make a circle look like a square.
One last thing:
I've made things look like a dropdown by disabling and enabling a container, in another container with overflow set to visible. It's not a straightforward experience, but it's doable. You have to make sure the content container always appear on top of everything else, and things like that. If you're not afraid of a little css (really not much), you can try it and see if you can make it work like what you have in mind.
Thanks a lot — I really like your perspective (no pun intended ).
You’re absolutely right: sometimes it’s better to stop fighting the framework and instead design with it, not against it. I was getting caught up in trying to make something look like an input/dropdown hybrid, but maybe it’s time to just fully embrace the popup approach.
The only reason I hesitated was because it’s used in a form with lots of other input fields, and I wanted this to “visually blend in.” But you’re right — it’s not worth forcing a square peg into a round hole if it compromises usability or maintainability.
).