setDataAtCell

Tags: #<Tag:0x00007efc60a533a0>
#1

Hi I am getting error when i use set data at cell in afterchange event either the screen froze or Maximum call stack size exceeded Kindly help.

#2

Hi @MZ1000_1

afterChange hook is fire after one or more cells has been changed.
The changes are triggered in any situation when the value is entered using an editor or changed using API (e.q setDataAtCell).
So if you use setDataAtCell inside afterChange you trigger in circles afterChange. Therefore you end in Maximum call stack size exceeded.

What your requirements are?

#3

can you tell alternative method for this?

#4

Could you explain to us what you want to achieve?

Can you show your implementation? With a demo is easier to find a solution.

#5 
hot3.addHook('afterChange', function (change, source, row, prop) {

    data = this.getDataAtCell(row);
    if (!change) {
        return;
    }
    else {


        //save all data to local storge if the edit happends
        $.each(change, function (index, element) {
            var custom = [];
            var row = element[0];
            var col = element[1];
            //if (col === "Track") {
            //    break
            //}
            var oldVal = element[2];
            var newVal = element[3];
            rowcol = hot3.getDataAtRow(row, col);
            rowcol.splice(-1, 1)
            var a = rowcol.length;
            var Rowcount = hot3.countRows();
            var IndexeddbName1 =  @Html.Raw('"' +IndexeddbName + '"') ;
            var ColumHeader = hot3.getColHeader();
            var ImportantField1 =  @Html.Raw('"' + ImportantField + '"') ;
            var str_array = ImportantField1.split(',');
            var TrackValidator = [];
            for (var i = 0; i < str_array.length; i++) {
                if (str_array[i] === "Yes") {

                    if (rowcol[i] !== '' && rowcol[i] !== null) {
                        TrackValidator.push(i);
                    }
                }

            }
            var CountImportfield = ImportantField1.split("Yes").length - 1
            var ColCount = hot3.countCols();
            var LastCol;
            var newColCount = ColCount - 1;
            if (CountImportfield === TrackValidator.length) {
                if (!setter) {
                    setter = true;
                    LastCol = "Track";
                    rowcol.push(LastCol)
                    //hot3.setDataAtCell(row, newColCount, 'Track')
                } else {
                    setter = false;
                    LastCol = "Track";
                    rowcol.push(LastCol)
                }

            } else {
                if (!setter) {
                    setter = true;
                    LastCol = "Please fill all Mandatory Field";
                    rowcol.push(LastCol)
                   // hot3.setDataAtCell(row, newColCount, 'Please fill all Mandatory Field')
                } else {
                    setter = false;
                    LastCol = "Please fill all Mandatory Field";
                    rowcol.push(LastCol)

                }
            }
            ColumHeader.splice(0, 1);
            if (ColumHeader.includes("Track") !== false) {
                for (var i = ColumHeader.length - 1; i >= 0; i--) {

                    if (ColumHeader[i] === "Track") {
                        //array.splice(i, i);
                    }
                }

            }
            var FixedColumnCount1 = @Html.Raw(FixedColumnCount);
            var FixedColumnsdata = @Html.Raw(Fixeddatas);
            var FixedColumns1 =  @Html.Raw("'" + FixedColumns + "'");
            var ConcatCountHT1 = @Html.Raw(ConcatCountHT);
            var ConcatColumnHT1 = @Html.Raw("'" + ConcatColumnHT + "'");
            var Htalasql = @Html.Raw("'" + HTDataAlsql + "'");
            //alert(col);
            if (col !== "Track" || col !== "id") {
               
                check(rowcol, row, col, newVal, Rowcount, IndexeddbName1, ColumHeader, FixedColumnCount1, FixedColumns1, FixedColumnsdata, ConcatCountHT1, ConcatColumnHT1, Htalasql, LastCol, ColCount);
                hot3.setDataAtCell(row, ColCount - 1, LastCol)
            }
            });

        //-------------------------------------------------------
    }

});
#6

it’s getting slow or throwing maximum call error.

#7

This result from that you can’t use setDataAtCell inside afterChange.

I think the better option is checking the upcoming data in the beforeChange hook.
Just like we write in the docs: Its main purpose is to alter changes silently after input and before
table rendering. - https://handsontable.com/docs/7.4.2/Hooks.html#event:beforeChange

But you have to operate on the changes array itself.
You can’t use setDataAtCell in beforeChange too.

#8

can you send example.

#9

is there any alternatives available.

#10

Here is an exampled demo - https://jsfiddle.net/4302kLb9/
If you change data in a row: 1 and column: 1 you the value always is changed to 10.

I don’t know what your purpose is, so I can’t find an alternative.
Could explain what is your requirements?

#11

is it possible , if i change row 1 and column 1 it should change row 1 and column 3?

#12

Yes, it is possible.
Here is an updated demo - https://jsfiddle.net/57uhv1da/

The main clue is to use a source to distinguish sources of changes.

I highly recommend you familiarize our blog post about cell dependencies - https://handsontable.com/blog/articles/2016/4/expand-your-app-with-cell-dependencies

#13

can we have a short meeting

#14

some times user will copy paste data at that time it should update another column based on the data

#15

You have to slightly change my previous demo to - https://jsfiddle.net/18wbo3zy/2/

You react only when the source is a CopyPaste.paste and in the concrete cell (in the demo is a cell 1.1). You could extend this second condition to all column or row. It depends on your needs.

When it comes to a short meeting please send us your license a support@handsontable.com.

#16

You can close this question , i found a alternative solution

#17