Select Box Behavior - page and shared qodlysources

General
1

I just finished implementing a select box and there was an interesting issue. I have a namespace with some qodlysources the pages all share.

When the main loader page loads I populate and array of objects called countries in the shared namespace so multiple pages can use

I create a page qodlysource that is a select box. The source for this component is the countries array of objects. The selectedElement is a page object qodlysource called selectedCountry.

The application indicates an issue with the selected value of the select box being a page qodlysource, when the qodlysource for the select box is a shared qodlysource.

Not sure if that is an expected issue. Just FYI.

2

is that just a warning?
it makes sense to do what you are doing, if you aren’t going to use a dataclass.

3

Hello Robert,

I just want to verify with you if this issue returned in the sanity check is the same that is shown on your side (I did the same steps: Qodly Source of the selectbox is a shared one, and for the selected element it is a page Qodly Source):

image
image661Ă—568 24.9 KB

Best regards.

4

Yes. this is what I saw. Thx.

5

Okay, if we test that, we can see all selectbox options, but the values are not shown:

image
image521Ă—298 7.7 KB

Solution: you should change the Qodly Source of the text bound inside the selectbox to $This.(your desired attribute):

image
image665Ă—337 18.3 KB

$This represents the iterator of that component, it is the default value of the property “iterate with”:

image
image306Ă—167 7.11 KB

So, as you can see in the following test (with $This), no issues returned in the sanity check:

image
image658Ă—228 15.1 KB

And in the preview, the values are displayed:

image
image464Ă—288 8.89 KB

1 Like
6

Thx. For this app, I have a table that stores some general application data in its attributes. I have a string attribute in it called countries that stores a collection of country objects in JSON string format.

Whenever the app loads, a function runs to populate the shared “countries” array/collection qodlysource with country data. If the countries data in the DB countries attribute > 120 days old, refreshed data is captured and populated from an external API/site. Otherwise data just pulled from the DB field.

Then ideally all pages can use the shared countries qodlysource if they need country data for components etc.

When a select box component has this shared qodlysource as its source of countries, but the selected country is a page qodlysource, I get that flag. There were othe hiccups that may have been related to that issue, so I am being safe and assuming it is not safe to just ignore..?
The workround was to copy the countries shared qodlysource to a page “countries” qodlysource on page init. Kind of ugly, but worked.

7

This did solve it. When I change the source of a selectbox from a page source to a shared source or vice versa, I need to be mindful that i cant just copy the text after $This. and paste the updated text. I need to make sure to reselect/retype the entire $This. and that will refresh the page source to the shared source or vice versa.

Thx for help.

Thx.

1 Like