2015-02-09 47 views
1

我想在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); 
} 

回答

0

管理幾個試驗:)

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