Subform Freeze Columns

Questions related to customising nuBuilder Forte with Javascript or PHP.

Subform Freeze Columns

Postby ernesttan1976 » Sat Aug 01, 2020 10:20 am

Hi to all, I really appreciate the developers of this software.

I created a subform called employees.
In this subform I am able to edit the fields which is really cool.

I want to be able to freeze the left 2 columns while I scroll to the fields to the right.

May I know how to go about this?
Attachments
Subform.jpg
Subform.jpg (332.03 KiB) Viewed 72 times
Last edited by ernesttan1976 on Sat Aug 01, 2020 4:12 pm, edited 2 times in total.
ernesttan1976
 
Posts: 17
Joined: Sat May 16, 2020 5:38 pm

Re: Subform

Postby ernesttan1976 » Sat Aug 01, 2020 10:24 am

Something like this columns selector, to be able to order the fields in a customized way
Attachments
Columns Selector.jpg
Columns Selector.jpg (61.02 KiB) Viewed 69 times
ernesttan1976
 
Posts: 17
Joined: Sat May 16, 2020 5:38 pm

Re: Subform

Postby kev1n » Sat Aug 01, 2020 3:13 pm

This is how you could freeze columns. Is this what you had in mind?
Attachments
subform_scroll_sticky_left.gif
subform_scroll_sticky_left.gif (663.25 KiB) Viewed 64 times
kev1n
 
Posts: 838
Joined: Mon Oct 15, 2018 2:13 am

Re: Subform

Postby ernesttan1976 » Sat Aug 01, 2020 3:14 pm

Yes
ernesttan1976
 
Posts: 17
Joined: Sat May 16, 2020 5:38 pm

Re: Subform

Postby kev1n » Sat Aug 01, 2020 3:20 pm

Add the following code to your (main) form's Custom Code.

Code: Select all
// Save the left position of your 2nd column. Replace **accform000slf_zzzzsys_form_idbutton** with your object ID. (Use the developer console to figure it out)
var originalBtnLeft = $('#accform000slf_zzzzsys_form_idbutton')[0].offsetLeft;

if (nuFormType() == 'edit') {
    $('#accform').scroll(function (e) {
     
        var scrollLeft = $(this).scrollLeft();
     
      // Replace slf_zzzzsys_form_idcode with the object ID of your first column
        $("[id$='slf_zzzzsys_form_idcode']").each(function () {
            $(this).css({
                'left': 0 + scrollLeft,
                'z-index': '100'
            });
        });

        // Replace slf_zzzzsys_form_idbutton with the object ID of your first column
        $("[id$='slf_zzzzsys_form_idbutton']").each(function () {
            $(this).css({
                'left': originalBtnLeft + scrollLeft,
                'z-index': '100'
            });
        });
    });
}
kev1n
 
Posts: 838
Joined: Mon Oct 15, 2018 2:13 am

Re: Subform

Postby kev1n » Sat Aug 01, 2020 3:23 pm

For your 2nd question: May I ask you to open a new topic for that? It will be easier for others to find answers in the future.
kev1n
 
Posts: 838
Joined: Mon Oct 15, 2018 2:13 am

Re: Subform

Postby ernesttan1976 » Sat Aug 01, 2020 4:07 pm

Thank you so much Kevin! :) Much much appreciated
ernesttan1976
 
Posts: 17
Joined: Sat May 16, 2020 5:38 pm

Re: Subform Freeze Columns

Postby ernesttan1976 » Sat Aug 01, 2020 7:07 pm

Success! Thank you Kevin :D

Code: Select all
// Save the left position of your 2nd column. Replace //**accform000slf_zzzzsys_form_idbutton** with your object ID. (Use the //developer console to figure it out)




var originalBtnLeft = $('#assigned_personnel000emp_name')[0].offsetLeft;

if (nuFormType() == 'edit') {
    $('#assigned_personnel').scroll(function (e) {
     //assigned_personnel
        var scrollLeft = $(this).scrollLeft();
     
      // Replace slf_zzzzsys_form_idcode with the object ID of your first column

        //All first column ends with "user_field_01"
        $("[id$='user_field_01']").each(function () {
            $(this).css({
                'left': 0 + scrollLeft,
                'z-index': '100'
            });
        });
       

        //First column header
        $("title_assigned_personneluser_field_01").each(function () {
            $(this).css({
                'left': 6 + scrollLeft,
                'z-index': '100'
            });
        });

        //All second column ends with emp_name
        $("[id$='emp_name']").each(function () {
            $(this).css({
                'left': originalBtnLeft + scrollLeft,
                'z-index': '100'
            });
        });
    });
}
ernesttan1976
 
Posts: 17
Joined: Sat May 16, 2020 5:38 pm



Return to Custom Code



cron