Create 2 columns within tabs on DV

Discussions related to customizing hooks. Hooks are documented at http://bigprof.com/appgini/help/advanced-topics/hooks/
Post Reply
bescott53
Veteran Member
Posts: 43
Joined: 2013-02-24 00:13

Create 2 columns within tabs on DV

Post by bescott53 » 2018-05-16 09:39

Hello board, I used the course that is provided to split my detailed view form into tabs and it looks great but is there a way to enhance this within the tab to show two columns rather than just one? I don’t see in the course how to do this.
Appgini 5.70

User avatar
baudwalker
Veteran Member
Posts: 82
Joined: 2015-02-03 08:08
Location: Bellingen NSW Australia

Re: Create 2 columns within tabs on DV

Post by baudwalker » 2018-05-16 12:00

Hi, If you continue with section 5 the udemy course you will get the 2 columns course.

Section 3 lesson 12 Organizing long forms into tabs
Section 3 lesson 13 Organizing long forms into a horizontal layout.

BArry

bescott53
Veteran Member
Posts: 43
Joined: 2013-02-24 00:13

Re: Create 2 columns within tabs on DV

Post by bescott53 » 2018-05-21 10:21

tried merging the two together but couldn't do it, would anyone help me out?

<style>
#form-tabs .nav-tabs a{ display: block !important; }
@media (min-width: 768px){
.form-inline .form-group{
width: 48%;
margin-bottom: 0.75em;
vertical-align: top;
}
}

</style>
<script>
$j(function(){
$j('#form-tabs').appendTo('#customers_dv_form');
$j('fieldset.form-horizontal').removeClass('form-horizontal').addClass('form-inline');

/* Fix for a bug with lookup drop-downs to set their correct width */
$j('.select2-container').addClass('option_list').css({ 'max-width': 'unset', 'width': 'unset' }).parents('.row').css({ 'width': '100%' });
Appgini 5.70

pböttcher
AppGini Super Hero
AppGini Super Hero
Posts: 113
Joined: 2018-04-01 10:12

Re: Create 2 columns within tabs on DV

Post by pböttcher » 2018-05-22 10:30

Hi,
you need to add the class "form-inline" to your "tabs".

e.g.

<div class="tab-pane active form-inline" id="project-info"></div>

or you need to add a replacement for the form-horizontal for the div via.

Code: Select all

$j('div.form-horizontal').removeClass('form-horizontal').addClass('form-inline');

bescott53
Veteran Member
Posts: 43
Joined: 2013-02-24 00:13

Re: Create 2 columns within tabs on DV

Post by bescott53 » 2018-05-22 15:10

Barry/ pböttcher this worked perfectly! thanks for your pointers with this!!
Appgini 5.70

Post Reply