new Item("wi_0650", "widget", "$4.25")
};
JsArray<JavaScriptObject> jsItems = javaArrayToJs(items, ItemJSProducer);
DataTable dt1 = Y.newDataTable(DataTableConfig.create().
columns(new String[]{"id", "name", "price"}).
data(jsItems).
caption("Example table with simple columns from java model").
summary("Price sheet for inventory parts"));
dt1.render("#ssimple1");
DataTable dt2 = Y.newDataTable(DataTableConfig.create().
columns(new String[]{"id", "name", "price"}).
data((JsArray<JavaScriptObject>) JsonUtils.unsafeEval("["+
"{id: \"ga_3475\", name: \"gadget\", price: \"$6.99\" },\n"+
"{ id: \"sp_9980\", name: \"sprocket\", price: \"$3.75\" },\n"+
"{ id: \"wi_0650\", name: \"widget\", price: \"$4.25\" }"+
"]")).
caption("Example table with sortable columns from json string").
summary("Price sheet for inventory parts").sortable(true));
dt2.render("#ssimple2");
//one more experiment: a data table that change its data after 3 secs
final DataTable dt3 = Y.newDataTable(DataTableConfig.create().
columns((JsArray<Column>) JsArr.create(
Column.create().key("username"),
Column.create().label("Access").children(new String[]{"read", "write"})).cast()).
data((JsArray<JavaScriptObject>) JsonUtils.unsafeEval("["+
"{ username: \"root\", read: true, write: true },\n"+
"{ username: \"spilgrim\", read: true, write: false },\n"+
"{ username: \"fizzgig\", read: false, write: false }"+
"]")).
caption("Example table with sortable columns from json string").
summary("Price sheet for inventory parts").sortable(true));
dt3.render("#ssimple3");
JsUtil.setTimeout(new SimpleCallback() {
@Override
public void call() {
dt3.data((JsArray<JavaScriptObject>) JsonUtils.unsafeEval("["+
"{ username: \"root123\", read: true, write: true },\n"+
"{ username: \"2222spilgrim\", read: true, write: false },\n"+
"{ username: \"3333fizzgig\", read: false, write: false }"+
"]"));
dt3.render();
}
}, 3000);
/*
* one more experiment: a data table with very custom columns -
* one using formatter, allowHTML and datatable event delegate for links
*/
Formatter urlColumnFormatter = new Formatter() {
@Override
public String format(FormatterContext o) {
return "<a href=\""+o.value()+"\">"+o.value()+"</a>";
}
};
JsArray<Column> columns4 = (JsArray<Column>) JsArr.create(
Column.create().key("username").sortable(true),
Column.create().label("Access").children(new String[]{"read", "write"}),
Column.create().key("url").label("Link").formatter(urlColumnFormatter).allowHTML(true).sortable(true)
).cast();
JsArray<JavaScriptObject> data4 = (JsArray<JavaScriptObject>) JsonUtils.unsafeEval("["+
"{ username: \"root\", read: true, write: true, url: \"http://www.microsoft.com\" },\n"+
"{ username: \"spilgrim\", read: true, write: false, url: \"http://www.yahoo.com\" },\n"+
"{ username: \"fizzgig\", read: false, write: false, url: \"http://www.google.com\" }"+
"]");
final DataTable dt4 = Y.newDataTable(DataTableConfig.create().
columns(columns4).
data(data4).
caption("a data table with very custom columns").
summary("Price sheet for inventory parts")
// .sortable(true)
);
dt4.render("#ssimple4");
//use Datatable.delegate() for preventing link default behavoir
dt4.delegate("click", new EventCallback<EventFacade>() {
@Override
public void call(EventFacade e) {
e.preventDefault();
}
}, "a");