Changing layout dynamically during page load may not work as expected

tarekahf

25-01-2018

I have this fragment whos layout has to be modified during page load:

The logo may have to be removed depending on the container parent form, and the section on the left and the right must be adjusted to increase the width to fill the available space. This feature is called responsive design which is not supported by LiveCycle forms.

I developed this code to hide/show the logo depending on the setting required, and change the width of the other elements to fill the space:

The "HideLogoFlag" is set on Initialize event by the parent form container.

I noticed the code "hideLogo()" will run twice, and the layout is messed up. So, I had to put control to prevent the code from running twice. The hide/show also must be run from the layout-ready event, otherwise, it will not work properly.

The main problem with the above code is that I have to set the width of each element accordingly. I was wondering if there is a an easier way to achieve this requirement.

EDIT: I am still facing issues. If I include the fragment twice on the same parent form, and call "hideLogo()" for both of them, the first will will work fine, but, the second instance layout will be slightly messed up. See image here of how the second instance will look when the hideLogo() is called. If the first instance layout is not modified (hideLogo() is not called), then the second install will work fine.

EDIT 2: I updated the code above to solve relayout issue. Basically, the relayout() must be executed once, and after all layout changes are done. Also, I used the width of the original template instead of the active element to change the width. Now, there is no layout issue, all I need is to simplify the code.

To implement this feature, call this function from the parent form on the initialize event:

sfClientAppraiser.opr.setHideLogoOn("Specify Text for Debugging", flag_do_relayout_true_or_false);

Note that I am converting all measures to inches.

Tarek

Accepted Solutions (0)

Answers (0)