Move "+add new record" button

Forms Public Forms
1

The "+Add new record" button on the data table appears at the top of the table regardless of whether new records are added to the top or bottom of the table rows. When adding new rows to the bottom (which seems more logical), the "+Add new record" button gets further and further away from the place on the form where the user is working as additional records are added.

Is there a way to place the "+Add new record" button at the bottom of the table instead of at the top?

2

Dear @donald.kantik,
Thank you for the question! We might add this feature to be toggled in the editor in the future, but for now, please, try the following JS code:

fd.rendered(function(){
  $(fd.control('DataTable1').$el).find('.fd-datatable > div:first').insertAfter($(".fd-datatable > div:last"));
});
3

I tried this JS code, however, it moved the button to the last datable available on the form. I have four datables, and when I used this on my first table, it moves to the fourth/last table; the same happens on the second table.

Any suggestion on how to make it work such that it only moves below the target databl?

4

Dear @Franc_Valencia,
I see why that might be the case, try this:

fd.rendered(function(){
  $(fd.control('DataTable1').$el).find('.fd-datatable > div:first').insertAfter($(fd.control('DataTable1').$el).find('.fd-datatable > div:last'));
});
1 Like