How to use DataBinder in TreeGrid?

Develop and Deploy Cross-Browser Web Apps .

How to use DataBinder in TreeGrid?

Postby Sergei » Fri Jun 07, 2013 3:18 am

I think it's not difficult, but I can not understand how to use the DataBinder (updateDataToUI, updateDataFromUI, setData, getData) at the inner binding in TreeGrid? Case Study does not work. Can fix it?
// The default code is a com class (inherited from xui.Com)
Class('App', 'xui.Com',{
// Ensure that all the value of "key/value pair" does not refer to external variables
Instance:{
// To initialize instance(e.g. properties)
initialize : function(){
// To determine whether or not the com will be destroyed, when the first UI control be destroyed
this.autoDestroy = true;
// To initialize properties
this.properties = {};
},
// To initialize internal components (mostly UI controls)
// *** If you're not a skilled, dont modify this function manually ***
iniComponents : function(){
// [[Code created by CrossUI RAD Tools
var host=this, children=[], append=function(child){children.push(child.get(0))};

append(
(new xui.DataBinder)
.setHost(host,"databinder_3")
.setRequestType("JSON")
.setName("databinder_3")
);

append(
(new xui.UI.TreeGrid)
.setHost(host,"ctl_treegrid14")
.setDataBinder("databinder_3")
.setDataField("demo")
.setRowNumbered(true)
.setHeader([{"id":"col1", "width":80, "type":"input", "caption":"col1"}, {"id":"col2", "width":80, "type":"input", "caption":"col2"}, {"id":"col3", "width":80, "type":"input", "caption":"col3"}, {"id":"col4", "width":80, "type":"input", "caption":"col4"}])
.setRows([{"cells":[{"value":"row1 col1", "id":"c_a"}, {"value":"row1 col2", "id":"c_b"}, {"value":"row1 col3", "id":"c_c"}, {"value":"row1 col4", "id":"c_d"}], "id":"d"}, {"cells":[{"value":"row2 col1", "id":"c_e"}, {"value":"row2 col2", "id":"c_f"}, {"value":"row2 col3", "id":"c_g"}, {"value":"row2 col4", "id":"c_h"}], "id":"e"}, {"cells":[{"value":"row3 col1", "id":"c_i"}, {"value":"row3 col2", "id":"c_j"}, {"value":"row3 col3", "id":"c_k"}, {"value":"row3 col4", "id":"c_l"}], "sub":[["sub1", "sub2", "sub3", "sub4"]], "id":"f"}])
.setValue("")
.setCustomStyle({"KEY":{"$gradients":""}, "HEADER":{"font-family":"arial black,avant garde", "$gradients":""}})
);

append(
(new xui.UI.SButton)
.setHost(host,"ctl_sbutton27")
.setLeft(420)
.setTop(40)
.setWidth(95)
.setCaption("Welcom")
.onClick("_ctl_sbutton27_onclick")
.setCustomStyle({"KEY":{"font-family":"times new roman,times,serif", "$gradients":""}})
);

return children;
// ]]Code created by CrossUI RAD Tools
},
// Give a chance to load other com
iniExComs : function(com, threadid){
},
// Give a chance to determine which UI controls will be appended to parent container
customAppend : function(parent, subId, left, top){
// "return false" will cause all the internal UI controls will be added to the parent panel
return false;
},
// This instance's events
events : {"onReady":"_com_onready"},
_com_onready : function (com,threadid){
xui.UI.cacheData('demo',[{"cells":[{"value":"row_1 col_1", "id":"c_a"}, {"value":"row_1 col_2", "id":"c_b"}, {"value":"row_1 col_3", "id":"c_c"}, {"value":"row_1 col_4", "id":"c_d"}], "id":"d"}, {"cells":[{"value":"row_2 col_1", "id":"c_e"}, {"value":"row_2 col_2", "id":"c_f"}, {"value":"row_2 col_3", "id":"c_g"}, {"value":"row_2 col_4", "id":"c_h"}], "id":"e"}, {"cells":[{"value":"row_3 col_1", "id":"c_i"}, {"value":"row_3 col_2", "id":"c_j"}, {"value":"row_3 col_3", "id":"c_k"}, {"value":"row_3 col_4", "id":"c_l"}], "sub":[["sub_1", "sub_2", "sub_3", "sub_4"]], "id":"f"}]);
},
_ctl_sbutton27_onclick : function (profile,e,src,value){
var ns = this, uictrl = profile.boxing();
ns.databinder_3.setData('demo',xui.UI.getCachedData('demo'));
ns.databinder_3.updateDataToUI();
}
}
});
Sergei
 
Posts: 31
Joined: Sat Apr 27, 2013 9:48 am

Re: How to use DataBinder in TreeGrid?

Postby Sergei » Fri Jun 07, 2013 5:04 am

Instructions ns.ctl_treegrid14.setRows (demo1);
not a pretty sight. I would like to use the standard method updateDataToUI. How is this possible?
Sergei
 
Posts: 31
Joined: Sat Apr 27, 2013 9:48 am

Re: How to use DataBinder in TreeGrid?

Postby support » Fri Jun 07, 2013 6:45 am

DataBinder is for controls(derived from xui.absValue) with "value" property .

You cant bind TreeGrid's header data or row data.
support
 
Posts: 352
Joined: Sat Apr 27, 2013 9:22 am

Re: How to use DataBinder in TreeGrid?

Postby Sergei » Fri Jun 07, 2013 7:40 am

Then why the value field components TreeGrid?
Sergei
 
Posts: 31
Joined: Sat Apr 27, 2013 9:48 am

Re: How to use DataBinder in TreeGrid?

Postby support » Fri Jun 07, 2013 8:29 am

support
 
Posts: 352
Joined: Sat Apr 27, 2013 9:22 am


Return to CrossUI for Web Apps

Who is online

Users browsing this forum: No registered users and 2 guests

cron