zoukankan      html  css  js  c++  java
  • Extjs中grid表格中去掉红三角

    在编辑Extjs的gridpanel的时候,数据有错误或是修改在每个单元格上都会出现红色的小三角,在每个列上面可以配置allowBlank: false来标识这个不可以为空

    有的时候在保存数据时如果不刷新页面也会留下红三角,那么在创建grid的时候,在grid里面加上下面的语句就不会再出现了:

    viewConfig: {
      markDirty: false
    }

    下面是grid的例子:

      1 var haomlTongjGeimjGrid = Ext.create('Ext.grid.Panel', {
      2         id: 'haomlTongjGeimjGrid',
      3         name: 'haomlTongjGeimjGrid',
      4         height: 100,
      5         store: haomlGeimjTongjGrid_store,
      6         header: false,
      7         columnLines : true, 
      8         selModel: selModelGeimjTongj, 
      9         autoScroll : true,
     10         selType: 'cellmodel',
     11         plugins: [rowEditingGeimjTongj],
     12         viewConfig: {
     13             markDirty: false//隐藏红三角
     14         },
     15         columns: [{
     16             xtype: 'gridcolumn',
     17              150,
     18             dataIndex: 'name',
     19             align: 'center',
     20             header:'<div style=" text-align: center; vertical-align: middle;">机组</div>',
     21             text: '机组'
     22         }, {
     23             xtype: 'numbercolumn',
     24             dataIndex: 'gaokgl',
     25             align: 'center',
     26              150,
     27             text: '高卡高硫煤(吨)',
     28             header:'<div style=" text-align: center; vertical-align: middle;">高卡高硫煤(吨)</div>',
     29             editor: {
     30                 xtype: 'numberfield',
     31                 minValue : 0,
     32                 allowBlank: true
     33             }
     34         }, {
    107             xtype: 'actioncolumn',
    108             align: 'center',
    109             30,
    110             items: [{
    111                 cls : "x-btn-text-icon",
    112                 icon: '../images/extjs/application_edit.png',
    113                 tooltip: '编辑',
    114                 handler: function(haomlTongjGeimjGrid, rowIndex, colIndex) {
    115                     var date = Ext.getCmp('statdate').getValue();
    116                     var nowdate = new Date();
    117                     var year = nowdate.getFullYear();
    118                     var month = nowdate.getMonth();
    119                     var day = nowdate.getDate();
    120                     var currentdate = new Date(year, month, day);
    121                     if(date >= currentdate){
    122                         rowEditingGeimjTongj.startEdit(rowIndex, 0);
    123                     }
    124                 }
    125             }]
    126         }]
    127     });

    同时也在可以在grid的edit事件中重新刷新页面去掉,当执行success回调函数时可以刷新页面,如下:

     1 haomlTongjGeimjGrid.on('edit', function(editor, e, eOpts){
     2         var record = haomlGeimjTongjGrid_store.getModifiedRecords();
     3         var results = '[';
     4         for ( var i = 0; i < record.length; i++)// 将要修改的数据,转成JSON
     5         {
     6             if (i == record.length - 1)// 如果为最后一条数据增加大括号
     7             {
     8                 results = results + Ext.JSON.encode(record[i].data)+ ']';
     9             } else {
    10                 results = results + Ext.JSON.encode(record[i].data)+ ',';
    11             }
    12         }  
    13         if (results == '[') {
    14             Ext.Msg.alert('提示信息:', '页面没有变动!');
    15             return false;
    16         }
    17 
    18         Ext.Ajax.request({
    19             url : 'saveDataOfGeimjTongj',
    20             jsonData : results, 
    21             params: {
    22                 peimdwid: Ext.getCmp("mixcoalunit").getValue(),
    23                 date: Ext.getCmp('statdate').getValue()
    24             },
    25             method : 'POST',
    26             success : function(response) { 
    27                 haomlTongjGeimjGrid.getSelectionModel().clearSelections();
    28                 
    29                 //重新加载给煤机耗煤量统计信息,这里我已经注销掉了
    30 //                haomlGeimjTongjGrid_store.load({
    31 //                     params: {
    32 //                         peimdwid: Ext.getCmp('mixcoalunit').getValue(),
    33 //                         statdate: Ext.getCmp('statdate').getValue()
    34 //                     }
    35 //                 });
    36                 
    37                 var text = response.responseText;
    38                 Ext.Msg.alert('提示信息:', text);
    39             },
    40             faliure: function (response) {
    41                 if(response.status == 404){
    42                     Ext.Msg.alert('提示信息', '运行错误!');
    43                 }
    44             }
    45         });
    46     });
  • 相关阅读:
    exit() _exit() 函数区别
    Linux-进程间通信(五): 网络套接字
    Linux-进程间通信(六): 记录锁
    Linux-进程间通信(N): 各种IPC的使用场景
    SQL EXISTS
    日志格式化
    logminer实战之生产环境写入数据字典,dg环境查询拷贝日志,测试环境进行挖掘,输出结果
    awr脚本使用dump导出导入
    logminer使用测试库进行挖掘分析,10.2.0.5
    10.2.0.5环境dg测试logminer挖掘日志分析
  • 原文地址:https://www.cnblogs.com/smallrock/p/3583667.html
Copyright © 2011-2022 走看看