diff --git a/bricks/datarow.js b/bricks/datarow.js
new file mode 100644
index 0000000..9edf000
--- /dev/null
+++ b/bricks/datarow.js
@@ -0,0 +1,100 @@
+var bricks = window.bricks || {};
+
+bricks.DataRow = class extends bricks.HBox {
+	/*
+	{
+		toolbar:[
+		]
+		fields:[]
+		css
+		header_css
+	}
+	*/
+	constructor(opts){
+		super(opts);
+	}
+	render_header(editable, checkable){
+		this.render(editable, checkable, true);
+	}
+	render_data(editable, checkable){
+		this.render(editable, checkable, false);
+	}
+	render(editable, checkable, header){
+		if (checkable){
+			var w = new bricks.UiCheck({name:'c',value:false})
+			this.add_widget(w);
+			w.bind(changed, this.get_check_state.bind(this));
+		}
+		this.build_toolbar(editable, header);
+		this.build_fields(header);
+	}
+	get_check_state(e){
+		d = e.target.getValue()
+		this.dispatch('checked', d.c)
+	}
+	build_toolbar(editable, header){
+		var tools = [];
+		const reserved = ['add', 'update', 'delete'];
+
+		if (editable){
+			if (header){
+				tools.push({
+					name:'add',
+					tip:'add new record',
+					icon:this.editable.add_icon || bricks_resource('imgs/add.png')
+				});
+				tools.push({
+					name:'blankicon'
+				});
+			} else {
+				tools.push({
+				});
+				tools.push({
+				});
+			}
+		}
+		if (header){
+			if (this.toolbar){
+				this.toolbar.tools.foreach(t => if (not reserved.includes(t.name)) tools.push({name:'blankicon'}));
+			}
+		} else {
+			if (this.toolbar){
+				this.toolbar.tools.foreach(t => if (not reserved.includes(t.name)) tools.push(t));
+			}
+		}
+		var toolbar = bricks.extend({cwidth:2.5}, this.toolbar || {});
+		toolbar.tools = tools;
+		var w = new bricks.IconBar(desc);
+		this.add_widget(w);
+		this.event_names = []
+		for(var i=0;i<tools.length;i++){
+			this.event_names.push(tools[i].name);
+			w.bind(tools[i].name, this.dispatch(tools[i].name));
+		}
+	}
+	build_fields(header){
+		for (var i=0;i<this.fields.length;i++){
+			var f = this.fields[i]
+			var opts = {
+				margin:'3px';
+			};
+			if (f.cwidth ){
+				opts.cwidth = f.cwidth;
+			} else if (f.width) {
+				opts.width = f.width
+			} else {
+				opts.width = '80px'
+			}
+			if (header){
+				opts.otext = f.label || f.name;
+				opts.i18n = true;
+			} else {
+				opts.text:f.value||f.defaultvalue||'';
+			}
+			var w = bricks.Text(opts);
+			this.add_widget(w)
+		}
+	}
+}
+
+bricks.Factory.register('DataRow', bricks.DataRow);
diff --git a/bricks/tabular.js b/bricks/tabular.js
new file mode 100644
index 0000000..ca38a4d
--- /dev/null
+++ b/bricks/tabular.js
@@ -0,0 +1,30 @@
+var bricks = window.bricks || {};
+bricks.Tabular = class extends DynamicAccordion {
+	constructor(opts){
+		super(opts);
+	}
+	async build_info(item, record){
+		if (record){
+			/* data row 
+			*/
+			var view = bricks.apply_data(this.record_View, record);
+			var dr = bricks.DataRow(view);
+			dr.render(this.editable, this.checkable, false);
+			dr.bind('update', this.update_record.bind(this, record, item));
+			dr.bind('delete', this.delete_record.bind(this, record, item));
+			for (e in dr.event_names){
+				dr.bind(e, this.record_event_handle.bind(this, record, item));
+			}
+			return dr;
+		} else {
+			var view = bricks.apply_data(this.record_View, record);
+			var dr = bricks.DataRow(view);
+			dr.render(this.editable, this.checkable, true);
+			dr.bind('add', this.add_record.bind(this, record, item));
+			return dr;
+		}
+			
+	}
+}
+
+bricks.Factory.register('Tabular', bricks.Tabular);
diff --git a/examples/echo.ws b/examples/echo.ws
index bf8fda6..1d2acd0 100644
--- a/examples/echo.ws
+++ b/examples/echo.ws
@@ -7,9 +7,21 @@
 #    is_online(id)
 #       检查id指定的客户端是否在线
 # user = await get_user()
-# ws_pool.register(user)
+userid = 'kkkkk'
+ws_pool.register(userid)
 resp = 'resp=' + ws_data
-print(f'{resp=}')
+if ws_pool.is_online(userid):
+	print(f'{userid=} is online')
+	ret = {
+		'efew':1,
+		'g':3
+	}
+	r = await ws_pool.sendto(ret, userid)
+	print(f'{ret=} send return {r}')
+else:
+	print(f'{userid=} is not online')
+
+print(f'{resp=}, {ws_pool.get_data()=}')
 await ws_pool.sendto(resp)
 # if ws_pool.is_online('bington'):
 #	await ws_pool.sendto(resp, 'bington')