27
Views
4
Comments
Solved
How to access extended properties of elements in Mobile applications

--This is for the Mobile App building process--


I am having trouble accessing extended properties of the elements i am defining on a screen using the outsystems editor



see the way i am setting up this button to have an additional note (the reason for setting it changes, and i want the subsequent code to be able to reference this attribute using a single switch)




When i do this, however, it seems to be filtering this attribute out of the DOM that it creates for the mobile application (so that i can no longer reference it through script)

here's what the page shows while "opening with Chrome"


notice the missing attribute

the only javascript i ahve attempted (and found this error) is this


$parameters.Chosen = document.getElementById($parameters.FirstChoice).additional_info;

where the "FirstChoice" is a variable used as an input parameter, and is being filled with the buttons id


So, i have 2 main questions:


  1. If this attribute were being created, and exists while debugging, is it wrong to assume that this field translates into an HTML attribute (see the tooltip above)?  If so, where is this attribute being stored?
  2. How would i best go about fixing this?
Rank: #139
Solution

Hi Ryan,


about being able to get the attribute into the DOM : OS will let through attributes that start with data-  

(see this post)

apart from that, I'm not sure your line of Javascript will work, specifically I think he won't know what to do with the last part, try doing it with getAttribute(...)

see attached oml


Hope this solves it for you,

Dorine

DemoButtonAttribute.oml

Staff
Rank: #3692

Hey Ryan! Just to double-check, you are accessing button? Your "h1" label was confusing as though maybe you labeled it as a header.

Under Properties and Attributes, make sure that your values can pull up the entities within the aggregates within the screens. To ensure that your entities and aggregates can show up, double-check your reference or Manage Dependencies (the plug icon) and also that your entity properties are set to Public/Yes

If you continue to scroll down you have Events and On Click, you can then connect a Client Action

In regards to your DOM question, are you using your Styles tab, to input your CSS attributes?

Extending UI with JS
https://www.outsystems.com/evaluation-guide/extending-the-ui-with-html-javascript-and-css/

Rank: #139
Solution

Hi Ryan,


about being able to get the attribute into the DOM : OS will let through attributes that start with data-  

(see this post)

apart from that, I'm not sure your line of Javascript will work, specifically I think he won't know what to do with the last part, try doing it with getAttribute(...)

see attached oml


Hope this solves it for you,

Dorine

DemoButtonAttribute.oml