Hi All,
I'm trying to show a block only when a certain textbox has data (i.e. is not empty). For this, I'm using a block which has dropdown search as input. This block can be added to maximum of 3 times on "Add Country" button. In inspect window, "CountryRiskBlock" is the name that I've passed in OutSystems. (refer below images)
I've added the block 3 times using "Add Country" button and that button converts to "Reinitialize Countries" text when counter is 3. The "Reinitialize Countries" will remove the 2nd and 3rd block and empty the text in the "Country Name" input of the first block.
But when I inspect the block, it's id is dynamically created and has certain code in front of user-given id (refer image above). According to my understanding, the formato of the id is : "14-3_<counter>-Id". Now this "14-3" will be different if I refresh the page. Also, the same thing happens to the input's id (below image)
My problem is that, when I have the block 3 times in the page, the other block that I want to show on the basis of the dropdown search input does not work. So I wanted to add a js and get value of these 3 inputs and if True show the other block. But since the id is randomly or dynamically generated, i'm not able to retrieve the element.
Also, if I do this process (add countries first, then reinitialize and then add countries again, do this 3-4 times), the numbers before the text in id gets added. its like a counter. (refer below image).
You can see the number is 18,19 and 20. I added countries and then reinitialized 5-6 times. now if I reinitialize again. the first block's id will be changed to "14-3_21-CountryRiskBlock". (a counter will be added to the id of third block's id (20 + 1 = 21) )
Thanks & Regards,
Aman Devrath
Hi Aman,
The HTML element IDs in Outsystems are generated dynamically and cannot be relied upon with any static values in your code. So you have to always assume any element you get your Outsystems app render on the screen, can have an ID which you're not aware of.
You can however use the WidgetName.ID property in your app to reference the dynamically generated ID of that widget. In your case it would be CountryRiskBlock.ID
With that property you can pass the rendered ID of the element to any of your code that wants to know the HTML ID of that widget.
Hi Ravi,
Thank you for the response.
I have some questions: 1. If I have more than 1 block which is same as explained above, shouldn't the ID be different for each of them? 2. I can't see the block. I'm using If condition and will pass a True or False if not empty using Widget.Id as suggested
1. Yes the ID would be different for each block rendered by Outsystems. However, this can't be guaranteed if you modify HTML yourself with any custom script (I'm not saying you're doing it, but just for the info).
2. Looks good from what you're following. What is the issue you're facing here? If you don't see the block, then it will be only because the condition is not satisfied.
I haven't done anything, just used IF and in the condition was looking for the block/widget. but didn't find them.
Can you create a small OML app showing this feature of your app? or share your OML?
It seems there must be several minor issues that can be fixed. It would take a lot of time to explain here before knowing exact code you're using.
I can fix it for you and send it with an explainer summary too, to make it quick and easy.
This is an in-house app of my company, I can't share my OML. I'll try to recreate this specific feature and then share.
Thank you.
Thanks Aman. That will certainly make it quite easier to understand, fix and explain.
Cheers!