How to save multiple forms data in several tabs at once to a database.
Please upload a sample.
Rgds,
Roshana
Assuming that you have forms ‘form1’,‘form2’,‘form3’
[code]var data = {};
dhx.extend(data, $$(‘form1’).getValues());
dhx.extend(data, $$(‘form2’).getValues());
dhx.extend(data, $$(‘form3’).getValues());
dhx.ajax().post(“save.php”, data);[/code]
above code will combine data from all forms and will post it to the specified script
Thank you for help,
Can I get the all clicked list items of each tab at once when I press save button in the same way?
example:
////////////
tabed list.html
//////////////
<script src="../common/viewsources.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../common/viewsources.css">
<script>
dhx.ready(function(){ // dhx.ready () is analogous to 'onDocumentReady ' event - occurs when the document has been completely parsed. The callback function will be invoked even if it was written after the document has loaded.
dhx.ui({
container:"box",
rows:[{//we define 2 rows. The first one is 'toolbar' that contains view-changer:'segmented' control.
view:"toolbar",
type:"MainBar",
id:"topbar",
elements:[{view:"button", type:"round", id:"Save", name:"Save", label:"Save", click:"save_form", inputWidth:100, align:"left"},
{ view:"segmented", id:"topControl", selected: 'tab_1', multiview:true, align:"center", options: [ // the first view'll be selected initially
{ value:"tab_1", label:"Names"},
{ value:"tab_2", label:"E-mails"},
{ value:"tab_3", label:"ID"}]
}]
},
{// the second row contains our main component - 'multiview'.
view:"multiview",
cells:[{view:"list",// specify 'list' component as the first view
id:"tab_1",//please note, views' id must coincide with keys specified in view-changer (in our case,'segmented')
//datatype:"xml", // data type of loaded data
url:"gridData.php", // loads data from the mentioned file into list
template:"#name#", // specifies the represented data
select:true, // defines whether list's item can be selected
type: { width: 575 }// width of the list
},
{view:"list",
id:"tab_2",
//datatype:"xml",
url:"gridData.php",
template:"#email#",
select:true
},
{view:"list",
id:"tab_3",
//datatype:"xml",
url:"gridData.php",
template:"#id#",
select:true
}
]}
]});
});
function save_form() {
var data = {};
dhx.extend(data, $$('tab_1').getValues());
dhx.extend(data, $$('tab_2').getValues());
dhx.extend(data, $$('tab_3').getValues());
dhx.ajax().post("post.php", data);
};
</script>
//////////////
griddata.php
///////////
///////////////////
post.php
////////////
rgds,
Roshana
Yep, you can use code like next
var data = {
list1: $$('tab_1').getSelected(),
list2: $$('tab_2').getSelected(),
list3: $$('tab_3').getSelected()
};
dhx.ajax().post("post.php", data);
Also, there is a more complex solution which allows to integrate list controls directly in form control, it can be used for scenario when you have dynamic count of list. But for simple case, when you know how many lists is in the app, and their ids - the above simple solution works fine enough.
Thank you for your quick reply.
I changed my code accordingly as follows.
When I click on save button values are not displaying in post.php.
Please help me.
rgds,
Roshana
Thank you very much.It works.
The clicked row number of each tab is shown when i clicked save button.
Could you please tell me how to get data value instead of clicked row number of each tab when I press save button.
Rgds,
Roshana
Change
$$(‘tab_1’).getSelected()
with
$$(‘tab_1’).item($$(‘tab_1’).getSelected()).value
instead of “value” - you can use any other property name
Thank you.It works 
<script type="text/javascript" charset="utf-8">
dhx.ready(function(){
dhx.ui({
rows:[{ view:‘segmented’,
view:“toolbar”,
type:“MainBar”,
id:“topbar”,
elements:[{ view:“segmented”, id:“topControl”, selected: ‘tab_1’, multiview:true, align:“center”, options: [
{ value:“tab_1”, label:“Names”},
{ value:“tab_2”, label:“E-mails”},
{ value:“tab_3”, label:“ID”}]},
{view:“button”, type:“round”, id:“saveButton”, name:“Save”, label:“Save”, inputWidth:100, align:“left”}
]
},
{
view:“multiview”,
cells:[{view:“list”,
id:“tab_1”,
url:“data.json”,
template:"#id#",
select:true,
type: { width: 575 }
},
{view:“list”,
id:“tab_2”,
url:“data.json”,
template:"#Package#",
select:true
},
{view:“list”,
id:“tab_3”,
url:“data.json”,
template:"#Version#",
select:true
}
]}
]});
$$(‘saveButton’).attachEvent(“onItemClick”, function(){
var data = {
//list1: $$(‘tab_1’).getSelected(),
list1: $$(‘tab_1’).item($$(‘tab_1’).getSelected()).id,
//list2: $$(‘tab_2’).getSelected(),
list2: $$(‘tab_2’).item($$(‘tab_2’).getSelected()).Package,
//list3: $$(‘tab_3’).getSelected()};
list3: $$(‘tab_3’).item($$(‘tab_3’).getSelected()).Version};
dhx.ajax().post(“post.php”, data, function(text){
alert(text);
});
});
});
</body>
I want to filter the each list in tabs using a rich combo for each list of above example.
Please help.
Rgds,
Roshana
You can use onChange event of combo - which occurs when some element from combo list was selected. After that you can call
list.filter(field, value);
to filtering the related list