在合金UI数据表中嵌入进度条

问题描述：

我想在AUI数据表的列中嵌入进度条。我试图使用这样的格式化函数，但它在状态栏上显示空白。我还需要调用初始化函数来使进度条工作。你有什么想法吗？在合金UI数据表中嵌入进度条

YUI().use(
    'datatable','datatable-scroll','datatable-sort', 
    function(Y) { 
     var cols = [ 
      { 
       label:'Name', 
       key:'name', 
       sortable: true 
      }, 
      { 
       label:'Status', 
       key:'status', 
       formatter: function(statusCell) { 
        statusCell.innerHTML = '<div id="progress" style="height:15px; width:0px; background-color:#8CC657;"/></div>'; 
       } 
      } 
     ]; 

     new Y.DataTable(
      { 
       columnset: cols, 
       recordset: fileInfo, 
       scrollable: "y", 
       height: "200px", 
       width: "400px" 
      } 
     ).render('#myDatatable'); 
    } 
); 

var prg_width = 200; 
var progress_run_id = null; 

function progress() { 
    var node = document.getElementById('progress'); 
    var w = node.style.width.match(/\d+/); 

    if (w == prg_width) { 
     clearInterval(progress_run_id); 
     w = 0; 
    } else { 
     w = parseInt(w) + 5 + 'px'; 
    } 

    node.style.width = w; 
} 

function initialize() { 
    progress_run_id = setInterval(progress, 30); 
}

答

管理几个试验:)

{ 
    label:'Status', 
    key:'status', 
    allowHTML: true, 
    formatter: function (o) { 
     o.innerHTML = 'required HTML for displaying progress bar'; 
     initialize(); 
     return o.innerHTML; 
    } 
}

后解决它

在合金UI数据表中嵌入进度条

相关推荐