nuBuilder Forum

Posted: **Sat May 10, 2025 4:20 pm**

I was thinking about how useful it would be to have some Tabbed Container to hold several elements (tables in my mind) in limited area of a form.
Now looking at existing ContentBox available i'm getting curious if there's a way to use it as some substisute (or workaround) for TabbedContainer in mind.
Say, place a button on top of the ContentBox which initially contains one subform (or ideally regular browse/edit form in an iframe, cos it presents convenient forms when adding/editing record), conventionally titled 'INCOMING'.
Upon pressed the button above changes its title to 'OUTGOING' and the ContentBox swaps its content for another corresponding subform. Thus we have (at least) two dynamically changing elements on a single space.
So is there a way to make this happen or it maybe an iframe that dynamically swaps its inners ..?
Cryuing for help,

Posted: **Sat May 10, 2025 11:04 pm**

Uzlander,

A nuBuilder Edit Form IS a tabbed container

and via a Run Object, you can add other Edit Forms (tabbed containers) inside that Edit Form.

But, obviously, the more you try to add to any one web page, the slower it will get.

Steven

Posted: **Sun May 11, 2025 3:56 pm**

Got it, thank you sir. To make things less complicated another strategy appeared, and question too:
Attempting to separate (form)UI into tabs i want a couple of elements(simple objects) just mirrored from tab1 (read only) always shown above in well visible place. As those are essential, place them above and outside the tab set (screenshot attached). Should i want to edit any, i go to respetive tab, find and edit it. Is that somehow possible ?

Posted: **Sun May 11, 2025 5:44 pm**

You can append custom html after the Save button, e.g.:

Code: Select all

$('#nuActionHolder').append(
  $('<div>', {
    css: {
      marginTop: '10px',
      marginLeft: '10px'
    }
  }).append(
    $('<b>').text('Date'), ': ', $('<span>', { id: 'date_field' }), ' ',
    $('<b>').text('Rate field'), ': ', $('<span>', { id: 'rate_field' })
  )
);

To update the date, call e.g.

Code: Select all

 $('#date_field').html('2025-05-11');

The additional "labels" can be updated when the form is loaded. If the content of an element changes, the labels can be updated accordingly as well

nuBuilder Forum

ContentBox element, to hold dynamically swappable objects/element

ContentBox element, to hold dynamically swappable objects/element

Re: ContentBox element, to hold dynamically swappable objects/element

Re: ContentBox element, to hold dynamically swappable objects/element

Re: ContentBox element, to hold dynamically swappable objects/element