交互与前端14 Tabulator 表格实践2

说明

将上一篇提到的内容进行了实现,整体上还算是比较符合预期吧,但并不是完美。这既和我的需求比较“妖”有关系,也和前端的确不太熟有关。但不管怎么样,反正实现了功能。


1 实现自动为表格增加有序值字段方法(这个应该是做过的,要挪移一下) ~ 1 Hour - 符合预期
2 将上述的脚本和对应视图进行检查和封装。 ~ 2 Hour - 超过预期1个小时,主要是因为建立了主键索引,当重复插入时会报错。我还以为是自己的工具有问题,调试了好一会。
3 增加自动根据数据库服务名创建连接的方法。 ~ 2 Hour - 符合预期


做完后我试着快速增加一个表格,大约花了5分钟,但是变量声明之类的过于粗糙,我觉得可以加一倍时间估计。这也低于之前预估的20分钟。

内容

1 将通用的js函数放到文件里

关于增删行和修改单元格的js函数。

// 编辑
var MyCellEdit02 = function(cell, onRendered, success, cancel){
   

    var cellValue = cell.getValue()
    input = document.createElement("input");
    row = cell.getRow()
    $(row.getElement()).css("background-color",'')
    $(row.getElement()).css("color", "")
    // input.setAttribute("type", "date");
    
    input.style.padding = "4px";
    input.style.width = "100%";
    input.style.boxSizing = "border-box";
    
    input.value = cellValue;
    
    onRendered(function(){
   
        input.focus();
        input.style.height = "100%";
        input.style.background ='yellow'
    });
    
    function onChange(){
   
        if(input.value != cellValue){
   
            row_id = cell.getData().id
            colname = cell.getColumn().getField()
    
            filter_dict = {
   }
            attr_dict = {
   }
            filter_dict['tid'] = row_id
            attr_dict[colname] = input.value
            attr_dict['_is_enable'] = 1
            attr_dict['_update_time']= getDatetime()
    
    
            // alert(colname)
            cell_para_dict = JSON.parse(JSON.stringify(para_dict))
            cell_para_dict['filter_dict'] = filter_dict 
            cell_para_dict['attr_dict'] = attr_dict
    
    
            row.update({
   '_update_time' :attr_dict['_update_time']})
    
            cell_post_json('/data/view015_x_update_mongo_data/', cell_para_dict, $(
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值