[CLOSED] ProgressBarColumn percentage problem

[ddeniz]

Hi,

i use ProgressBarColumn in gridpanel and when i set progressbar dataindex by percentage it seems like integer but my datavalue is float.

Example; datavalue= 56,37 but it seems 5637%

how can i set percentage value to progressbar?

[Daniil]

Hi @ddeniz,

A ProgressBarColumn supports float values and it expects values less than 1.
https://examples2.ext.net/#/GridPane...ressBarColumn/

The lowest division is 1 percent.

If you need to changed the behavior, you can override a ProgressBarColumn's Renderer.

Ext.define('MyOverrides', {
    override: "Ext.ux.grid.column.ProgressBar",

    renderer: function (value, meta) {
        var me = this,
            text,
            cls = me.progressCls,
            pCls,
            cWidth = me.getWidth(true) - 2;

        if (me.hideIfEmpty && (!value && value !== 0 || value < 0)) {
            return "";
        }

        value = value || 0;

        text = Ext.String.format(me.progressText, Math.round(value * 100)); //you should change this line

        pCls = cls + ' ' + cls + '-' + me.ui;
        meta.tdCls = "x-progress-column-cell";
        meta.style = "padding:0px;margin:0px;";
        v = '<div class="' + pCls + '" style="margin:1px 1px 1px 1px;width:' + cWidth + 'px;"><div class="' + cls + '-text ' + cls + '-text-back" style="width:' + (cWidth - 2) + 'px;">' +
                text +
            '</div>' +
            '<div class="' + cls + '-bar ' + cls + '-bar-' + me.ui + '" style="width: ' + value * 100 + '%;">' +
                '<div class="' + cls + '-text" style="width:' + (cWidth - 2) + 'px;">' +
                    '<div>' + text + '</div>' +
                '</div>' +
            '</div></div>'
        return v;
    }
});

[ddeniz]

Thank you @Daniil