开放源代码的web表格控件(转)

开放源代码的web表格控件

表格输入控件例子
序号	第一列	第二列
1
2

OTable对象

说明

本控件完全使用javascript编写，还在不断完善中。欢迎大家下载试用并提出改进意见。控件开放源代码。

1、支持上下左右键切换单元格焦点；
2、支持backspace删除整行功能：把焦点移到最后一个单元格，按backspace键可以从行尾删到行首；
3、支持alt+x删除焦点所在行；
4、支持焦点设置功能；
5、表头无限制，任意设置；

参数

v_id：表格id。

属性

hasSort：第一列是否为序号列，true则是，false则不是。

columnCount：表格总列数。

columnWidths：数组，每列中输入框的宽度。

sortColor：颜色值，字符串格式，序号单元格的底色，如#cccccc。

方法

init(v_xmldata,v_classname)：初始化表格，v_xmldata为xml结构的数据；v_classname为行的样式名称。

addRow(v_classname)：在表格中增加一行，v_classname为行的样式名称。

deleteRow()：删除表格中最后一行。

deleteRowAt(v_rowindex)：删除表格中指定行，v_rowindex为数据行索引（>=0）。

deleteAllRow()：删除表格中所有行。

getData()：获取表格中数据，为XML结构的数据。如果一行都为空，则忽略此行。

setFocus(v_row,v_col)：设置表格焦点，v_row是表格的行索引，v_col是表格的列索引。

js下载

table.js   主对象
ajax.js   xml解析支持函数

使用例子

初始化
var ot = new OTable("tableBigPlan");
ot.hasSort = true;
ot.columnCount = 3;
ot.columnWidths = new Array("50","100","100");
ot.addRow("");

提交结果
var oHttpReq = CreateXMLHttp();
oHttpReq.open("POST", url, true);
oHttpReq.send(ot.getData());

服务端处理接收代码
System.IO.Stream stream = Request.InputStream;
System.IO.StreamReader reader = new System.IO.StreamReader(stream, System.Text.Encoding.UTF8);
string datastr = reader.ReadToEnd();

System.IO.Stream stream2 = new System.IO.MemoryStream(System.Text.Encoding.Default.GetBytes(datastr));
DataSet ds = new DataSet();
ds.ReadXml(stream2);

附：传入传出的xml数据结构

<?xml version='1.0' encoding='gb2312'?>
<data>
  <table>
    <col1>test1</col1><col2>a</col2>
  </table>
  <table>
    <col1>test2</col1><col2>b</col2>
  </table>
</data>