Hi Sir ,
I have modified the code for this sample “http://dhtmlx.com/docs/products/dhtmlxForm/samples/05_integration/06_split_more_complex.html” as below .
After click button b1 . How can I reload “form_cell_c” to dhxLayout.cells(“c”) by button b2 ?
Thank you
Best regards
Complex split
#layoutObj {
position: relative;
width: 600px;
height: 660px;
}
var dhxLayout, dhxTabbar, myForm, formData;
function zero(s) {
if (s.length==1) s = "0"+s;
return s;
}
function doOnLoad() {
formData = [
{type: "settings", position: "label-left", labelWidth: 145, inputWidth: 150},
{type: "block", inputWidth: "auto", id: "form_cell_a", list:[
{type: "input", label: "First Name", value: "James", offsetTop: 14},
{type: "input", label: "Last Name", value: "Brown"},
{type: "select", label: "Sex", value: "male", options:[
{text: "Male", value: "male"},
{text: "Female", value: "female"}
]},
{type: "block", offsetTop:0 , inputWidth: "auto", list:[
{type: "button",name:"b1", value: "b1", offsetTop:0},{type: "newcolumn"},
{type: "button",name:"b2", value: "b2", offsetTop: 0}
]}
]},
{type: "block", inputWidth: "auto", id: "form_tab1", list:[
{type: "input", label: "Login", value: "james_br", offsetTop: 14},
{type: "password", label: "Password", value: "12345"},
{type: "password", label: "Confirm password", value: "12345"},
{type: "select", label: "Account type", value: "user", options:[
{text: "Admin", value: "admin"},
{text: "Organiser", value: "org"},
{text: "User", value: "user"}
]},
{type: "checkbox", label: "Allow OAuth login", checked: true},
{type: "checkbox", label: "Allow OpenID login", checked: true}
]},
{type: "block", inputWidth: "auto", id: "form_tab2", list:[
{type: "input", label: "Street address", value: "22 Acacia Avenue", offsetTop: 14},
{type: "input", label: "City", value: "Oslo"},
{type: "input", label: "Country", value: "Norway"},
{type: "input", label: "Phone", value: "+47 12 34 56 78"},
{type: "input", label: "Fax", value: "+47 12 34 56 79"},
{type: "input", label: "Mobile", value: "+47 12 34 56 80"}
]},
{type: "block", inputWidth: "auto", id: "form_tab3", list:[
{type: "settings", position: "label-right", labelWidth: 200},
{type: "checkbox", label: "Send e-mail notifications", checked: true, offsetTop: 14, list:[
{type: "checkbox", label: "News & events", checked: true},
{type: "checkbox", label: "Advertisement"},
{type: "checkbox", label: "Account info updates", checked: true},
{type: "checkbox", label: "My posts/My threads updates", checked: true}
]}
]},
{type: "block", inputWidth: "auto", id: "form_cell_c", list:[
{type: "input", label: "Account created", value: "22-09-1997 12:37", readonly: true, offsetTop: 14},
{type: "input", label: "Created by", value: "Robert Patrick", readonly: true},
{type: "input", label: "Last account update", value: "19-02-2011 19:54", readonly: true},
{type: "input", label: "Updated by", value: "Matt Lazovsky", readonly: true}
]}
];
dhxLayout = new dhtmlXLayoutObject("layoutObj", "3E");
dhxLayout.cells("a").setText("Common Information");
dhxLayout.cells("a").setHeight(200);
dhxLayout.cells("c").setText("Account Update");
dhxLayout.cells("c").setHeight(215);
dhxTabbar = dhxLayout.cells("b").attachTabbar({
tabs: [
{id: "a1", text: "Login Details", active: true},
{id: "a2", text: "Address / Phone"},
{id: "a3", text: "E-mailing"}
]
});
myForm = dhxLayout.cells("a").attachForm(formData);
myForm.attachEvent("onButtonClick", function(id){
if(id=="b2"){
///?? reload attachObject("form_cell_c") to dhxLayout.cells("c")
}
if(id=="b1"){
myGrid = dhxLayout.cells("c").attachGrid();
myGrid.setImagePath("../../codebase/imgs/")
myGrid.loadXML("../common/grid.xml?etc="+new Date().getTime());
}
});
dhxTabbar.cells("a1").attachObject("form_tab1");
dhxTabbar.cells("a2").attachObject("form_tab2");
dhxTabbar.cells("a3").attachObject("form_tab3");
dhxTabbar.cells("a1").showInnerScroll();
dhxTabbar.cells("a2").showInnerScroll();
dhxTabbar.cells("a3").showInnerScroll();
dhxLayout.cells("c").attachObject("form_cell_c");
dhxLayout.cells("c").showInnerScroll();
}
</script>