встроить индикатор выполнения в таблицу данных пользовательского интерфейса сплава

Я пытаюсь встроить индикатор выполнения в столбец данных AUI. Я пытался использовать функцию форматирования, подобную этой, но в столбце состояния отображается пустое значение. Мне также нужно вызвать функцию инициализации, чтобы индикатор выполнения работал. У вас есть идеи на этот счет?

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);
}

progress-bar yui-datatable alloy-ui
person user596502    schedule 09.02.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Удалось решить это после нескольких испытаний :)

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