I’m running through the UIBuilder Master Class and doing the Collections exercise. I’m stuck getting the block to repeat inside the block that has ‘Dynamic List Behavior’ checked. I’ve erased and re-started three times now and I just can’t get the block to repeat - in fact it doesn’t show up at all. When I remove ‘Dynamic List Behavior’ I get a single colored circle with nothing in it.
It doesn’t seem to be respecting the Data Binding. If I add another element like a text element and bind it to my same Page Data property, it works fine. It shows all items in my collection.
Any ideas?
Thanks!
Here are my code blocks:
First the On Click event on the button:
Now the On Page Enter block:
Here’s my binding on the List Block:
Here’s my screen Preview with a Text component beneath the list box whose content is bound to the same pdMyList property on Page Data.
Hi Kirk,
I think what you should do it is assign varList back to pdMyList in Page Data (after you modify varList).
Regards,
Mark
No Luck. Here’s the new On Click Event block:
If the pdMyList wasn’t being updated, then the log should show only the latest entry with each button click. I think there’s an issue with the simple binding (ie: just typing pdMyList in the Dynamic Items Logic). If you look at the text component I added that has the same binding, it doesn’t include any commas, just seems to be a mashed together concatenation of the items.
What does the block that has the Dynamic List Behavior contain in it? Is it empty?
Here’s the UI designer screen
Here’s one that shows that Dynamic List Behavior is checked
There is one error when I look at the Developer Tools (I’m using Edge)
I just tried in Chrome and got the same behavior and error.
The list is bound to pdMyList. It is a collection of strings (please correct me if I am wrong).
The UI children of the block will be repeated for every object in your list. And the UI children need to have binding on their own. And that’s where the data will be coming from to be rendered. In other words, it is not sufficient to have a data binding for the block, the block itself needs to have UI components which will render data through data binding.
With that being said, if you change the structure of the pdMyList collection to contain objects. And suppose every object has a property called dataToRender with some string value. Then the text component inside of the purple circle can have data binding for the dataToRender property. Then, you will some data on the page.
Hope this helps.
Regards,
Mark
I would assume a collection of strings too since the pdItem property in Page Data is bound the Content of the input box (which should be a string). Here is the binding of the Text object in the internal block (the one that should be repeated).
It shows a little differently than the one you show in the video.
As for containing objects instead of strings, I suppose I could figure that out, but I only did exactly what you did in the video. Are strings not objects?
No, you cannot bind a Dynamic List Behavior block to a collection of strings. This is for the reason that the UI children of that block would have no data binding property to reference.
OK. Maybe I missed something earlier in the video. I’ll check again.
Thanks for the quick replies, by the way - it’s really appreciated!
I just reviewed the video and you’re right, it is a list of strings, and instead of data binding, the text component is using logic. I understand what you were referring to here.
Have you confirmed that myPdList contains actual values? Also, try adding the print block in the Content Logic of the text component to print out ListBlock Item Data. You will be able to see the printed value in the browser’s Console tab.
Regards,
Mark
Hi Mark
Yes, there is data in the pdMyList property on PageData. I added a textbox with the same binding as the ListBlock. It shows the items without any delimiters. If I look at the content of the page I see that it’s listing the list of strings in the resulting tags:
So there is data there. It’s just not triggering the Dynamic List Behavior for some reason. Notice the <div> above is the ListBlock.
K
What is your application id and the name of the page that has the logic? I will take a look at it.
Regards,
Mark
