2010-05-12

tableview新版本发布

Web
Views: 18076 | 2 Comments

tableview 即原来的 two-column-selector, 在升级为 1.1 版本时, 它的项目名称变为 tableview. 1.1 版本最大的变化是加入了排序功能.

在网页开发中, 常常需要一个表格与列表相结合的控件, 即能像表格(table)一样显示丰富的信息, 又能像列表选择控件(select)一样方便地选择数据. 在桌面应用程序开发中, 许多GUI库都提供了类似的控件, 如.Net的ListView.

  • PagerView是一个好看精巧的分页控件. PagerView+TableView为网页开发提供了类似的工具, 但代码更简单, 功能更紧凑.
  • SortView是一个方便易用的分页控件.
  • TableView是一个数据表格控件, 代码简单, 功能紧凑.
  • SelectorView是一个由两个TableView组合而成的控件, 相对于列表选择器, 提供了一个临时的存放已选中项的地方.

下载及文档: http://www.ideawu.net/person/tableview/v1.1/

Related posts:

  1. tableview新增单选功能
  2. JavaScript数据表格和分页控件文档升级
  3. tableview的SortView有更新
  4. JavaScript分页控件
  5. JavaScript+jQuery两栏选择控件
Posted by ideawu at 2010-05-12 22:16:46 Tags:

2 Responses to "tableview新版本发布"

  • ideawu 2011-08-19 at 15:37:39
    to liruoyu: 很高兴tableview对你有帮助. TableView.getSelectedRows获取的是原始的数据, 而不是所看到的数据. 像你的需求, 要获取的是输入框的内容, 目前只能自己获取. TableView的功能还在改进当中, 如果未来它发展成为DataGrid, 那么整合编辑功能就比较自然了. 不过, 那样又会导致TableView庞大. 这当中有一些取舍.

    你的update用得很巧妙, 我后续可以考虑把这项功能加入进去.

    不知道你使用SortView的问题是什么? 能否把代码贴一下? Reply
  • liruoyu 2011-08-19 at 02:17:55
    最近项目中用了您的tableview控件，效果非常好，在此表示感谢！
    另外本人也发现一些可以改进及困惑的地方，想邮件与您交流却不知去哪获取，只能在此留言。
    小弟因业务需要，在table中某些字段需要编辑，您的示例做法是：
    var input_html = ‘<input type="text" name="a" size="2" class="textbox" />';
    可当使用
    var rows = table.getDataSource()；
    获取数据时，rows中的字段数据并不是input中用户输入的数据，而是input标签信息，因此本人在tableview.js中加入了update方法，把用户填入的信息替换掉原始的标签。
    /**
    * 更新一条记录.
    * @param {Object} row: 记录对象.
    * @author liruoyu
    */
    this.update = function(rowkey,updatekey,updatevalue){

    var index = array_index_of_key_update(self.rows, self.dataKey, rowkey, updatekey, updatevalue);
    if(index != -1){
    return;
    }
    this.rows.push(row);
    this._display_rows.push(row);
    if(self._rendered){
    self.render();
    }
    };

    使用方法：
    var rows = sel.dst.getDataSource();
    for(var i in rows){
    var rowkey = rows[i][sel.dst.dataKey];

    var quantityvalue = $("#quantity"+rowkey+"")[0].value;
    sel.dst.update(rowkey,’Quantity’,quantityvalue);
    }
    var newrows = sel.dst.getDataSource();
    经改善后tableview控件可以任意加入各种编辑控件。

    另还有一个问题，sortview.js控件中如果想后端ajax分页经您提示可重写onclick方法实现，但还是不明究竟，望指导解答。期盼您的回复，谢谢！ Reply

Leave a Comment