Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
bootstrap 4 - adding items to IWBS4Select
#1
Hi,

I ran into new problem while trying to convert to Bootstrap 4.
I have a combo box TIWBS4Select with some items and I would like to add some more - I put a button and with a click on that button I want to add one more item:

Code:
IWBS4Select1.Items.Add('new 1');

When I run the program in this line I'm getting an error: 'access violation at adress xxxxxx'. What is the correct way of adding items?

Kind regards,
Bostjan
Reply
#2
Hi Bostjan,

Yes, that is the correct way. I have it working without a problem. I'll create an example with modal dialog and select this weekend and post it here.
Reply
#3
(10-14-2021, 08:41 PM)jeroen.rottink Wrote: Hi Bostjan,

Yes, that is the correct way. I have it working without a problem. I'll create an example with modal dialog and select this weekend and post it here.

Hi, Jeroen!

Can you please post a working example because I'm still struggling. 

Thanks.
Reply
#4
Hi Bostjan,

I am sorry. I was sick this weekend and still am.
I wanted to create a better example but you will have to do with attached example for the moment. Hope it's enough for you.


Attached Files
.zip   bostjan.zip (Size: 32.43 KB / Downloads: 4)
Reply
#5
(10-18-2021, 12:08 PM)jeroen.rottink Wrote: Hi Bostjan,

I am sorry. I was sick this weekend and still am.
I wanted to create a better example but you will have to do with attached example for the moment. Hope it's enough for you.

Hi, Jeroen!

Thank you for your example. I see you are not using Layout manager (TIWBS4LayoutMgr) but instead TemplateProcessorHTML. Is there any special reason for it?

Get well soon.

Kind regards,
Bostjan
Reply
#6
Hi Bostjan,

Most important question: Does it make a difference for your IWBS4Select problem? It shouldn't. In both cases you should have a working select control.

TIWBS4LayoutMgr is a component that renders your TIW... components into a .html page.
It adds the Bootstrap4 .js and .css files to the generated output and it controls the order in which the TIW... controls are rendered.

TIWTemplateProcessorHTML is another Layout manager. It has no knowledge about bootstrap or any other frontend framework. It uses a .html template file (in my example .\templates\DlgMain.html) combined with the class (TDlgMain) to render the final .html file that is send to the browser. It gives me more flexibility and a better separation between form and function. Eg a web designer can work on the design using the template file and I can work on the rest.
See http://docs.atozed.com/docs.dll/developm...lates.html

Btw: In my example the modal dialog TFrameModalTest, uses TIWBS4LayoutMgr. When TIWBS4Moab.LayoutMgr is unassigned, a default TIWBS4LayoutMgr object as layout manager is created.
Reply
#7
(10-19-2021, 12:18 PM)jeroen.rottink Wrote: Hi Bostjan,

Most important question: Does it make a difference for your IWBS4Select problem? It shouldn't. In both cases you should have a working select control.

TIWBS4LayoutMgr is a component that renders your TIW... components into a .html page.
It adds the Bootstrap4 .js and .css files to the generated output and it controls the order in which the TIW... controls are rendered.

TIWTemplateProcessorHTML is another Layout manager. It has no knowledge about bootstrap or any other frontend framework. It uses a .html template file (in my example .\templates\DlgMain.html) combined with the class (TDlgMain) to render the final .html file that is send to the browser. It gives me more flexibility and a better separation between form and function. Eg a web designer can work on the design using the template file and I can work on the rest.
See http://docs.atozed.com/docs.dll/developm...lates.html

Btw: In my example the modal dialog TFrameModalTest, uses TIWBS4LayoutMgr. When TIWBS4Moab.LayoutMgr is unassigned, a default TIWBS4LayoutMgr object as layout manager is created.

Hi, Jeroen!

I'm using TIWBS4LayoutMgr and my example raises error that I have no idea how to fix while your example is working like it should. I'm sending my example in attachment for comparation. I've never using templates before, I guess I'll have to learn it Smile 

Kind regards,


Attached Files
.zip   SelectTestNotWorking.zip (Size: 27.73 KB / Downloads: 2)
Reply
#8
A small update - now I discover if I try on the main form, then IWBS4Select works fine, but when I add one more form on that new form it doesn't work anymore (access violation). I'm starting to believe that it should be a bug. Can please someone from Atozed also check my example?
Reply
#9
Hi Bostjan,

There where several errors. I changed your example, still using TIWBS4LayoutMgr. I think there are more possible solutions but this is a working one with v15.2.40
Main observation: Start using Chrome Developer Tools (F12) or similar. They give you lots of insights about what is happening and what is going wrong.
You have to use these tools to learn and build knowledge about IntraWeb. 'Google Is Your Best Friend'.

First thing DevTools showed was that several resources could not be found. You were using CDN by calling IWBS4LibSetCDNS so there seems an error in iwbootstrap4.
I e-mailed Alexandre and assume this gets fixed in a future release.
For the moment best thing to do is don't use CDN and host the resources yourself inside .\wwwroot folder. These ship as part of the IntraWeb installation under 'IntraWeb 15\Source\iwbootstrap4\redist'
Be aware that some errors, like typo's exist in this folder. Alexandre is aware of this as well.

But even after these changes the combobox was not working. An AV was generated after pressing button 'Add to Combo'.
Location of the AV was IWBSSelect1.OnHTMLTag eventhandler adding a runtime css class.
I currently don't know why this is happening. Maybe somebody else can jump in here.
By adding an item to the combobox, the control is recreated in js but that isn't a problem I think.

So find another solution: You want a select control in a 'col-sm-6'. That was your reason for the IWBSSelect1.OnHTMLTag I assume.
First I tried the TIWBS4FormGroup. Set the Css property at designtime but this wasn't working. DevTools (yes quite handy!) shows a javascript error. Alexandre??
Looking in the Bootstrap documentation, a form-group is not very special so probably a TIWBS4Region with BSRegionType set to bs4rtFormGroup would be ok.
And it is! With these changes your IWBS4Select example is working.

You can download the example from https://1drv.ms/u/s!ArMgm0CJ1IAVh0jTer1x...c?e=6OxVKf (too big for the forum because of the included wwwroot resources)

Kind regards,
Jeroen Röttink
Reply
#10
(10-19-2021, 07:57 PM)jeroen.rottink Wrote: Hi Bostjan,

There where several errors. I changed your example, still using TIWBS4LayoutMgr. I think there are more possible solutions but this is a working one with v15.2.40
Main observation: Start using Chrome Developer Tools (F12) or similar. They give you lots of insights about what is happening and what is going wrong.
You have to use these tools to learn and build knowledge about IntraWeb. 'Google Is Your Best Friend'.

First thing DevTools showed was that several resources could not be found. You were using CDN by calling IWBS4LibSetCDNS so there seems an error in iwbootstrap4.
I e-mailed Alexandre and assume this gets fixed in a future release.
For the moment best thing to do is don't use CDN and host the resources yourself inside .\wwwroot folder. These ship as part of the IntraWeb installation under 'IntraWeb 15\Source\iwbootstrap4\redist'
Be aware that some errors, like typo's exist in this folder. Alexandre is aware of this as well.

But even after these changes the combobox was not working. An AV was generated after pressing button 'Add to Combo'.
Location of the AV was IWBSSelect1.OnHTMLTag eventhandler adding a runtime css class.
I currently don't know why this is happening. Maybe somebody else can jump in here.
By adding an item to the combobox, the control is recreated in js but that isn't a problem I think.

So find another solution: You want a select control in a 'col-sm-6'. That was your reason for the IWBSSelect1.OnHTMLTag I assume.
First I tried the TIWBS4FormGroup. Set the Css property at designtime but this wasn't working. DevTools (yes quite handy!) shows a javascript error. Alexandre??
Looking in the Bootstrap documentation, a form-group is not very special so probably a TIWBS4Region with BSRegionType set to bs4rtFormGroup would be ok.
And it is! With these changes your IWBS4Select example is working.

You can download the example from https://1drv.ms/u/s!ArMgm0CJ1IAVh0jTer1x...c?e=6OxVKf (too big for the forum because of the included wwwroot resources)

Kind regards,
Jeroen Röttink

Hi, Jeroen!

Thank you for taking time to check my example and for all your suggestions. You were correct - I'm getting AV error in OnHTMLTag - without it is working. So I guess there I something wrong in OnHTMLTag (bug?). I will repeat your word - Alexandre??

Kind regards,
Bostjan
Reply


Forum Jump:


Users browsing this thread: 2 Guest(s)