Page 1 of 1

Organizing Long Form

Posted: 2018-05-18 19:16
by uchhavi
Hi
With reference to the Udemy Course, I organized the form into tabs.

It worked out well... only the glitch is that I am not able to open the other tab.

Please see the code that I added to my file and the image shows the tab that i cannot open.

Can you please help me solve this.

/* if this is the print preview, don't modify the detail view */
if(isset($_REQUEST['dvprint_x'])) return;

ob_start(); ?>

<div id="form-tabs">
<ul class="nav nav-tabs">
<li class="active"><a href=“#project-info" data-toggle="tab">Project Info</a></li>
<li><a href=“#quotation-info" data-toggle="tab">Quotation Info</a></li>
</ul>

<ul class="tab-content">
<div class="tab-pane active form-horizontal" id="project-info"></div>
<div class="tab-pane form-horizontal" id="quotation-info"></div>
</ul>
</div>

<style>
#form-tabs .nav-tabs a{ display: block !important; }
</style>

<script>
$j(function(){
$j('#form-tabs').appendTo('#PROJECT_TB_dv_form');

/* fields to move to the project info tab */
$j('#PROJ_ID').parents('.form-group').appendTo('#project-info');
$j('#PROJECT_NAME').parents('.form-group').appendTo('#project-info');
$j('#PIC').parents('.form-group').appendTo('#project-info');
$j('#PRODUCT').parents('.form-group').appendTo('#project-info');
$j('#CURRENCY').parents('.form-group').appendTo('#project-info');
$j('#VALUE').parents('.form-group').appendTo('#project-info');
$j('#PROJECT_STATUS').parents('.form-group').appendTo('#project-info');
$j('#IMPORTANCE').parents('.form-group').appendTo('#project-info');
$j('#CONSULTANT_CO').parents('.form-group').appendTo('#project-info');
$j('#CONSULTANT_PIC').parents('.form-group').appendTo('#project-info');
$j('#CONTRACTOR_CO').parents('.form-group').appendTo('#project-info');
$j('#CONTRACTOR_PIC').parents('.form-group').appendTo('#project-info');
$j('#ACTION_SALES_PIC').parents('.form-group').appendTo('#project-info');
$j('#ACTION_MGT').parents('.form-group').appendTo('#project-info');
$j('#NOTES').parents('.form-group').appendTo('#project-info');


/* fields to move to the quotation info tab */
$j('#QUOTATION_SENT').parents('.form-group').appendTo('#quotation-info');
$j('#PRODUCT_1').parents('.form-group').appendTo('#quotation-info');
$j('#VALUE_1').parents('.form-group').appendTo('#quotation-info');
})
</script>

<?php
$tabs = ob_get_contents();
ob_end_clean();

$html .= $tabs;

Re: Organizing Long Form

Posted: 2018-05-18 19:53
by pbottcher
Hi,
can you verify that you put the quotes correctly. In your code I see

a href=“#project-info"
a href=“#quotation-info"

which should be
a href="#project-info"
a href="#quotation-info"

Note: “ != "

Re: Organizing Long Form

Posted: 2018-05-19 09:58
by grimblefritz
This might help. I based it off the Udemy course and tried to make it a bit easier to manage forms.

http://grimblefritz.com/formtools/