Iam using a dhtmlx 1C layout
1C layout inside two tabs home and validation tab
My question is how to set a minheight for layout ?
because validation tab can contain a form and home tab can contain some content but home tab take lot of space how to set minheight in dhtmlx layout.
And i also attached a screenshot…
Hello
Could you provide us completed demo to see the logic of your code? We need it to advise you the right approach.
docs.dhtmlx.com/doku.php?id=othe … leted_demo
AccountManagement
<link rel="STYLESHEET" type="text/css" href="stylesheet.css">
<script src="dhtmlx/dhtmlx.js"></script>
<link rel="stylesheet" type="text/css" href="dhtmlx/dhtmlx.css">
<script src="dhtmlx/types/ftypes.js"></script>
<link rel="stylesheet" type="text/css" href="dhtmlx/types/ftypes.css">
<div class="dhtml_form_content">
<div id="dhtmlForm" style="position:relative;margin:5px auto;padding:10px;border:1px dotted;width: 850px;height:600px;"></div>
<script type="text/javascript" language="javascript">
function doOnLoad() {
/******* Tabbar image path set *********/
dhtmlx.image_path='dhtmlx/imgs/';
/******* Tabbar image path set *********/
var main_layout = new dhtmlXLayoutObject('dhtmlForm', '1C');
var a = main_layout.cells('a');
a.hideHeader();
var memberManageSettings = a.attachTabbar();
memberManageSettings.setAlign('left');
memberManageSettings.addTab('memberHome','Home','');
var memberHome = memberManageSettings.cells('memberHome');
/******* Dummy Content ****/
var frmHome = [
{type:"settings", position:"label-top"},
{type: "block", list:[
{type: "label", offsetTop:8, label: "Lorem Ipsum"},
]},
{type: "block", name:"home_text", list:[
{type: "input", offsetTop:8, value: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",rows:8, readonly:true, style:"width:650px;height:auto;border:0;"},
]},
];
var formHome = memberHome.attachForm(frmHome);
/******* Dummy Content ****/
memberManageSettings.addTab('MemberValidation','Validation','');
var MemberValidation = memberManageSettings.cells('MemberValidation');
/******* Dummy Content ****/
var frmValidation = [
{type:"settings", position:"label-top"},
{type: "block", list:[
{type: "label", offsetTop:8, label: "Contactus"},
]},
{type: "block", name:"ngovalidation_text", list:[
{ type:"settings" , labelWidth:80, inputWidth:250, position:"absolute" },
{ type:"input" , name:"form_input_4", label:"Username", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:25, inputLeft:50, inputTop:46 },
{ type:"input" , name:"form_input_5", label:"Email", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:75, inputLeft:50, inputTop:96 },
{ type:"input" , name:"form_input_6", label:"Email-confirm", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:125, inputLeft:50, inputTop:146 },
{ type:"input" , name:"form_input_7", label:"password", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:175, inputLeft:50, inputTop:196 },
{ type:"input" , name:"form_input_8", label:"password confirm", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:225, inputLeft:50, inputTop:246 },
{ type:"input" , name:"form_input_9", label:"country", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:275, inputLeft:50, inputTop:296 },
{ type:"input" , name:"form_input_10", label:"Phone", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:325, inputLeft:50, inputTop:346 },
{ type:"input" , name:"form_input_11", label:"Postal code", labelWidth:250, labelAlign:"left", labelLeft:50, labelTop:375, inputLeft:50, inputTop:396 },
{ type:"button" , name:"form_button_1", label:"Submit", value:"Submit", width:"250", inputLeft:50, inputTop:450 }
]},
];
var formValidation = MemberValidation.attachForm(frmValidation);
}
</script>
</div>
Could you clarify your cuesstion by providing us an image with expected result?
My question is how to set a minheight for layout ?
and I want to remove the empty space in home tab the layout adjust automatically…according to
size of the content.And i also attached a screenshot…
So in your case you don’t need to use layout. You can init tabbar directly in a div “dhtmlForm”. In that case you can use the approach from demo
tabbar.rar (68.8 KB)
Thank you.But iam using layout inside tabs in all the forms .so can you give any another solution…
As i see from your demo you are using a TABBAR INSIDE layout, not on the contrary.
In this way my recomendation is the only way.
How to use my forms in tabbar.iam using forms in validation tab in previous complete demo zip file
Here is a sample of using form in tabbar:
dhtmlx.com/docs/products/dht … nside.html
Here is a sample of form validation:
dhtmlx.com/docs/products/dht … s/06_data/
Here is a tabbar documentation:
docs.dhtmlx.com/doku.php?id=dhtmlxtabbar:toc
Here is a form documentation:
docs.dhtmlx.com/doku.php?id=dhtmlxform:toc
Here is a form-validation documentation in particular:
docs.dhtmlx.com/doku.php?id=dhtmlxform:it_valid
It must help you as well