cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
flippomendes
Nintex Newbie

Fixed top bar on Nintex form

Jump to solution

Hello,

      I'm looking to build a Nintex form that has a fixed top section that is visible at all times while the body of the form scrolls up and down(underneath the top section).

I almost got it to work with CSS , but the body of the form slides over the top section instead of sliding under.

I did some digging and my findings is that this kind of functionality isn't possible with CSS.

Is this possible with Nintex? or is there any nintex extension that can provide this functionality?

I have spent a lot of time on this. I'm on the verge of giving up on it.

 

Cheers!

Labels: (1)
0 Kudos
Reply
9 Replies
paul_crawford
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

Frank Mendes

this css could help. I haven't tried this in nintex forms. Have a go and I will try too

Fixed header, scrollable body. - JSFiddle 

Reply
janvonreith
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

Would be great if this works, please keep us up to date! If I'll find the time before you find it I will ;-)

0 Kudos
Reply
Automation Master
Automation Master

Re: Fixed top bar on Nintex form

Jump to solution

I think this will be possible because I did something similar way long back by adding scroll bars to something, so I'm hoping ‌'s solution works for you.   If this is a long form and hence the header needing to be in view as a reference, you could also consider a "tabbed" approach where the header remains visible, and then tabs underneath reveal sections of the form.  Hopefully the scrolling works though since that is what you requested.

Reply
paul_crawford
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

Frank Mendes

Now i'm in front of my machine and can test this properly, i have an update to my original answer.

It can be done a lot easir than the fiddle I posted.

To accomplish what you want i added and panel and get it a css class of scroll. I added controls to the form as required. Then i added this css to the form Custom CSS settings

.scroll{
    position: relative;
    height: 250px;
    max-height: 250px;
    overflow-y: scroll;
}‍‍‍‍‍‍‍‍‍‍‍

This sets the panel to have a height of 250 and a max height of 250 so anything over this invokes the scroll bar.

I did find it a bit fiddly having to delete the css each time to edit the form as required and then reapply but it does give the experience you want

Hope this helps

Reply
flippomendes
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

Thanks  Paul! This solution is easier than the fiddle. I tried it and it worked. however, there are now two scrolls on the page 

Is it possible to get rid of the 1st scroll bar?

0 Kudos
Reply
paul_crawford
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

On my form it worked without any additional scroll bars. do you have any other controls on the page that could be causing it?

0 Kudos
Reply
flippomendes
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

I may be doing this wrong. Here is what I did

I have the header in one panel and the remainder of the form in another panel(2nd panel)

I then added the scroll class to 2nd panel.

Is this how you went about your own solution? 

0 Kudos
Reply
paul_crawford
Nintex Newbie

Re: Fixed top bar on Nintex form

Jump to solution

Exactly that, the only other thing i did was in form settings ensure the design area of you form is longer than the max-height of the scrollable area, even if it is completely empty:

Maybe that will sort it?

Reply
Automation Master
Automation Master

Re: Fixed top bar on Nintex form

Jump to solution

‌ - did ‌'s suggestion work out for you?

0 Kudos
Reply