Experimenting with Accordion menu to right of a browse

[jking]

Hi Bruce,

     I'm experimenting with placing an Accordion Menu to the right of a browse.  I'm using example web app Web56 for this.  I created an Accordion Menu on a NetWebSource procedure.  Next, I created a NetWebForm onto which I placed the browse procedure and my test menu procedure.  The NetWebForm procedure is called as a pop-up from a new item on the top Drop menu.  The results are seen in Image1.png.  I have added a custom.css file to help position the menu on the right so that it aligns with the top of the browse.
     Things look promising, however, the browse is too narrow as are it's buttons.  I can resize the pop-up window but this causes the browse to position itself vertically lower and then there is too much empty space on the right.  Do you have any suggestions on how to better place the browse and the test menu?

     I have attached the Web56 app and custom.css file should you want to look at what I have so far.

Thank you,

Jeff King

[Bruce]

Hi Jeff,

Two things;
a) switch the browse & form layouts from Flex-Div to Flex-Grid. (in WebServer procedure)
b) Also in web server procedure, set the CSS to "reset to defaults". ie;
In WebServer extension, Settings, Styles, then all tabs there, tick (and leave on) "Reset to Defaults".
this will alight the global css settings to the current recommended global css settings.

then in MailBoxesBrowseControl, Children tab, TestSideMenu child, set "Start Column (grid only)" to 2, and span column to 1.
(I don't think the above does anything in this situation, but it's more correct.)

At this point you'll see the browse/menu fill the popup, so make the popup as wide as you like.
You'll also notice the browse is "centered" vertically, that's because of the css
align-items:center;
which is on the containing form cell div. You can put custom css in there to align-items top if you like.

Cheers
Bruce

[jking]

Thanks Bruce!  That helped a lot. 

I now have a nice Accordion or Task Panel menu to the right of my browse.  I do have one other new issue however.  There is a horizontal scrollbar at the bottom of my pop-up form.  It appears no matter how wide the form is.  Please see attached image.

I'm not able to see the scrollbar in the browser dev mode so cannot figure out how to remove it.  Any ideas on this?

For those following this thread, Bruce's instructions assume NetTalk 12 is used.

Thanks again Bruce,

Jeff

[Bruce]

post an updated example app here Jeff so I can see what you are seeing.
I expect it's a CSS thing which is creating some space to the right of the menu.

[jking]

Bruce,

     I have attached a zip file containing the most recent app and css file.  Thanks for looking at this.

Jeff

[Jane]

Jeff,

I often wind up with an annoying useless scrollbar at the bottom of popups.

It seems to arise out of pressure between a width:100%!important property combined with left/right margin settings.

I've found I can avoid it by setting CSS on the inner div to override the margins, or by setting overflow:hidden on the parent div.

Pics.

jf

[jking]

Thanks Jane!

     I created my own class, my-nt-form, in my custom.css file to set the margin to 0.  I used this my-nt-form class on the Form Div field of the CSS Classes tab and now no more scroll bar!  Works great.

Jeff

[jking]

Hello everyone,

     Part two of this project is to start calling other procedures from this new "side menu".  I find I can't call pop-up forms.

     From a regular drop menu I call a form that contains the browse procedure with a menu to the right...the menu is in a source procedure.  I have the menu items calling other browse procedures as pop-ups, but this does not work.  All that happens is the page name of the called browse procedure appears in the tab of the main procedure.  Please see arrows on the attached image.  Another browse procedure should open as a pop-up, over the first pop-up.  This also does not work with the example app, Web56, I used for testing.

     Any ideas what the problem might be?

Thanks,

Jeff King

[Bruce]

>> I find I can't call pop-up forms.

That does not completely surprise me. Indeed I would be somewhat surprised if you could.
The whole popup system is complicated (because things don't "pop up" - they were there all along they just got unhidden", which means they are created when the page is _constructed_ which means a lot of things.)

I think you may want to re-think your architecture here. I'm not sure if you can make it all work, but I would say a good starting point is that the popups you want to appear, should also be in the main menu somewhere (perhaps visually hidden using css). If they are in the main menu, then they exist, and you have a reasonable chance of the second menu opening them (as long as the second menu has the opening set to popup)

[jking]

Bruce,

     Thanks!  Adding the popups to a "hidden menu" on the main menu does work.  I have attached an image of the result.

Jeff

[Jane]

Looks nice, Jeff! 👍

[jking]

Hi Jane and Bruce,

     This project was on hold for about 2 years, now I'm back on it.  I know there is a template option to add a condition to include menu items but would rather disable menu items conditionally.  Is this possible yet?

Thanks,

Jeff

[Bruce]

your condition could be a variable, and you can just set it however you like (to say true or false) before it is used.

ie - inspect the generated code, see where the condition is used, and just add whatever you like before that.

[jking]

Hi Bruce,

     I have looked at the source and I can see where the condition appears in the code.  See attached image.  However, rather than conditionally hide a menu item, I want to just conditionally disable it.  That is, allow the text of the menu item to remain visible, greyed out, and not clickable.  A post from a few years ago mentioned it was not possible to disable a TaskPanel menu item yet, so I was wondering if this is something planned for a future update or a way to do this now?

Thanks,

Jeff

[Bruce]

>> A post from a few years ago mentioned it was not possible to disable a TaskPanel menu item yet, so I was wondering if this is something planned for a future update or a way to do this now?

It isn't planned (at least not on my list) and I haven't done any work in this space for ages, so I presume it hasn't changed.
If you'd like to get it on a list, post in the Feature-Request section of the forums.
(you should likely post an example as well)