Uncaught TypeError: Cannot read property 'replace' of null jqgrid

davidb picture davidb · Apr 4, 2017 · Viewed 20.5k times · Source

i am new to programming. when i try this below function, it works well unless there is a blank cell in the column. if there is any blank value in the cell then it is not working and then entire page goes blank. please help me to fix.

        function growth (cellvalue) {
                        var gcolor;
                        var numval=cellvalue
                        var val = Number(numval.replace("%",""));
                        if (val<0) {
                            gcolor = 'red';
                        } else if (val>0) {
                            gcolor = 'green';
                        } 
                        return '<span class="cellWithoutBackground" style="background-color:' + gcolor + ';">' + cellvalue + '</span>';
                    };

i have also tried this below with not equal to null like this if (val !== null && val<0)

    function growth (cellvalue) {
var gcolor;
var numval=cellvalue
var val = Number(numval.replace("%",""));
if (val !== null && val<0) {
gcolor = 'red';
} else if (val !== null && val>0) {
gcolor = 'green';
} 
return '<span class="cellWithoutBackground" style="background-color:' + gcolor + ';">' + cellvalue + '</span>';
};

both works fine when there is no blank cell. but when there is a blank cell, it is not working. please help.

UPDATE

function growth (cellvalue) {
                        var numval=cellvalue
                        if(numval != null || numval != '' || numval != "")
                        {
                        var gcolor;
                        var val = Number(numval.replace("%",""));
                        if(val<0) {gcolor = 'red';}
                        else if(val >0) {gcolor = 'green';}
                        return '<span class="cellWithoutBackground" style="background-color:' + gcolor + ';">' + cellvalue + '</span>';
                        };
                       else{return '<span class="cellWithoutBackground" style="background-color:' + white + ';">' + cellvalue + '</span>';};

browser console log

Answer

Oleg picture Oleg · Apr 4, 2017

You should test cellvalue != null before trying to parse the value. Testing for cellvalue != null means in JavaScript the same as cellvalue !== null || cellvalue !== undefined. In both cases you should don't use cellvalue.replace (or numval.replace).

The next possible problem in your code will be the usage of numeric values as input data. For example you can use 123 instead of "123". The Number type has no method replace and you could have one more error. I recommend you to use String(cellvalue) to convert the number to the string if it's not already the string.

Try something like

function growth (cellvalue) {
    if (cellvalue == null) { // test for null or undefined
        return "";
    }
    cellvalue = Number(String(cellvalue).replace("%",""));
    return '<span class="cellWithoutBackground" style="background-color:' +
        (cellvalue < 0 ? 'red' : 'green') +
        ';">' + cellvalue + '</span>';
}