appdoo (Mac) Documentation

Data Links

Most elements have “Data Links” settings within appdoo. For this reason we describe this area here in general. The Hyperlink element represents the other elements.

The properties or behavior of elements is not statically limited to what you specify at the time you create the project or app. An app only becomes really interesting and useful if you can populate individual parts with dynamic content. In this area appdoo offers you a lot of possibilities and a description of all would go far beyond the scope of this documentation. For this reason, we would like to show you the basics of how appdoo works. This will give you a solid foundation for implementing all your ideas.

At Wikipedia, for example, there is an extra page for each year (example: https://en.wikipedia.org/wiki/2019) with all important information about this year. If you would like to link to this page from your app, you could of course do this in such a way that you simply assign the URL for this year to the element “Hyperlink”. But what happens on 01.01. of next year? You would have to publish an update of your app exactly at this time. But there is an easier way. Simply define the URL of the hyperlink dynamically with the current year.

To create the URL with the current year we will use the element “Data Processing”. With this element you can execute any JavaScript code. It is important that you return the required value with “return”. But let’s take a look at all this step by step.

1. Add the “Hyperlink” element to your work space.
2. Add the “Data Processing” element to your screen. Simply scroll to this element in the list of elements and double-click it. It now appears in your outline in the “Objects” folder.
3. Select the newly added element “Data Processing” in your outline.
4. Now click on the “Properties” tab in the right sidebar. There you will see a multiline text area. In this area we will now write our JavaScript code to dynamically generate the URL to Wikipedia.
5. So that we have a little more space, enlarge the right sidebar by dragging the left side of the sidebar a little to the left. The sidebar becomes wider.
6. Insert the following content into the text area:

   const year = new Date().getFullYear();
   let url = 'https://en.wikipedia.org/wiki/${year}';
   return url;
   

   

7. We can also test if our script returns the expected result. Click on the “Evaluate” button below the text area. The text field below should now read: “https://en.wikipedia.org/wiki/2019”.
8. Activate the checkbox “Evaluate immediately” so that our “Data Processing” is processed immediately after the start of the app.
9. Now select the element “Hyperlink” again in the outline.
10. Click on the tab “Data Links” in the right sidebar.
11. To link the result of our element “Data Processing” with the value for the URL of the hyperlink, click on the “Link” button on the right “URL”.
12. Select the value “Data Processing” from the first selectbox and the value “Value” from the second selectbox.
13. The correct URL “https://en.wikipedia.org/wiki/2019” should now already be below the second selectbox.
14. If you now switch to the tab “Properties” in the right sidebar, you will see how appdoo displays a link to our element “Data Processing” for the URL field.
15. Make sure that the “Open URL in Safari” value is selected in the “Action” selectbox.

If you now look at your project in the appdoo preview app and click on the link, the corresponding page will open in Safari and we have reached our goal.