After I remove rows from DataTable and add data again, I get error "TypeError: Cannot set property."

After I remove rows from DataTable and add data again, I get error "TypeError: Cannot set property."

auxoauxo Posts: 3Questions: 1Answers: 0

Link to test case: as code pasted
Debugger code (DataTables Debugger): ubepah
Error messages shown:
datatables.min.js:16 Uncaught TypeError: Cannot set properties of undefined (setting 'iSeq')
at H.isPlainObject.f (datatables.min.js:16:11272)
at g (datatables.min.js:26:5851)
at s._mouseUp (datatables.min.js:26:6434)
at HTMLDocument.<anonymous> (datatables.min.js:26:4054)
at HTMLDocument.dispatch (jquery-3.7.0.min.js:2:39997)
at v.handle (jquery-3.7.0.min.js:2:37968)
Description of problem:
After I remove rows from DataTable and add data again, I get error "datatables.min.js:16 Uncaught TypeError: Cannot set properties of undefined (setting 'iSeq') ".

After some hard work, I found this:

    set: function(a) {
        var f;
        return H.isPlainObject(a) ? V.util.set(a._) : null === a ? function() {}
        : "function" == typeof a ? function(t, e, n) {
            a(t, "set", e, n)
        }
        : "string" != typeof a || -1 === a.indexOf(".") && -1 === a.indexOf("[") && -1 === a.indexOf("(") ? function(t, e) {
            t[a] = e
        }

.....

However, t is undefined....Orz

Please help me. Many thanks.

all the best,

Auxo

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,394Questions: 1Answers: 10,450 Site admin

    Hi Auxo,

    I've created this little test case which I think shows the make parts of what your debug trace uses (i.e. DataTables + RowReorder) and reading data from the DOM.

    It doesn't show the error you are seeing though. Can you update it, or link to your own page, so I can see the error and debug it?

    Allan

  • auxoauxo Posts: 3Questions: 1Answers: 0

    Hi Allen,
    May I post this test code as gist?

    If you drag the second row to the top of the table, I think the error will reoccur.

  • allanallan Posts: 63,394Questions: 1Answers: 10,450 Site admin
    Answer ✓

    This is it running.

    I can see the error happening there.

                    this.dataList$.subscribe(data => {
                        this.table.clear().draw();
                        updateTable(this.table, extractFields(data, listShowCols.concat(["DIAGENGNAME", "DIAGCHINNAME"])));
                    });
    

    Is causing the error when combined with:

                reorderRow() {
                    this.table.on('row-reorder', (e, diff, edit) => {
                        // 原始的 this.dataList$
                        let tmpData = this.dataList$.getValue();
                        let reverseTmpData = tmpData.map((x) => _.cloneDeep(x));
    
                        reverseTmpData = reverseTmpData.reverse();
    
                        diff.forEach((rowDiff) => {
                            reverseTmpData[rowDiff.oldPosition].iSeq = rowDiff.newData;
                        });
    
                        reverseTmpData.sort((a, b) => b.iSeq - a.iSeq);
    
                        this.dataList$.next(reverseTmpData);
                    });
                }
    

    When you reorder data array the subscription handler is being run before DataTables / RowReorder can fully process the change. The result is that nodes get cleared out and where RowReorder attempts to reference a node it fails, since the nodes it knows about no longer exist.

    I think you'll have more luck using row-reordered which happens at the end of the processing that RowReordering does.

    Allan

  • auxoauxo Posts: 3Questions: 1Answers: 0

    Oh, thank you! You really saved my day. ^^

Sign In or Register to comment.