Allow dynamic templates about ngx-datatable

[amcdnl]

Can you provide a demo?

[adaur]

Interesting, it's something I am currently tring to do. I have a Edit button, and once the edition is complete the data in the datatable doesn't update itself whereas the example here does: https://github.com/DavideViolante/Angular2-Express-Mongoose

If I refresh the page or I search for a term that does not exist and remove it, it seems to "recall" the data somehow and the new value is displayed.

[amcdnl]

You need to update your data in the results itself. See this: https://github.com/swimlane/angular-data-table/blob/master/demos/inline-editing.html#L100

Its for ng1 version but still should apply. Open to suggestions on better approaches.

[adaur]

Thanks for your answer.

Actually, I would like to manually trigger the update, it should not be that hard, right?

I have

this.http.put("/cat/"+cat._id, JSON.stringify(cat), this.options).subscribe(
            res => {
                this.isEditing = false;
                this.cat = cat;
                // here I try to update using the function in the constructor
                this.route.data.subscribe(data => {
                    this.temp = [...data];
                    this.rows.push(...data)
                });
                this.sendInfoMsg("item edited successfully.", "success");
            },
            error => console.log(error)
        );

but this duplicates all the rows instead of replacing them. Adding this.rows = []; doesn't seem to help.

Sorry for the flood :)

[amcdnl]

Is this getting triggered? https://github.com/swimlane/angular2-data-table/blob/master/src/components/DataTable.ts#L99

[adaur]

Sorry, I'm really a JS newbie... How can I check it? I added a console.log above it and it did not seem to pass there but I am not sure if the ts code was not cached before.

[adaur]

Interestingly, if I do

submitEdit(row) {
        this.http.put("/cat/"+row._id, JSON.stringify(row), this.options).subscribe(
            res => {
                this.isEditing = false;
                this.row = row;
                console.log(this.rows); // <-- this returns all the rows, including the update I just did
                this.sendInfoMsg("item edited successfully.", "success");
            },
            error => console.log(error)
        );
    }

Since the rows are changed, there must be some kind of event not being emitted properly.

[adaur]

I have created a simple function:

updateRows() {
        console.log('rows updated');
    }

then added this in the datatable DOM

<datatable
                class='material'
                [rows]='rows'
                [options]='optionsTable'
                (onRowsUpdate)='updateRows()'>

But the event does not seem to get fired when I edit an element. It does at loading, though.

All I need is a reset() function to force the table to reload, or edit a specific row. Any hint on this?

[amcdnl]

Splice out the rows and re-insert them.

[adaur]

That's what I did later, copying the updateFilter function without the filter part, but it just does not work (ie: table not refreshing). I even tried to add an Update button to reload the rows... same result. I also tried to add a ngModelChange in the <datatable> but I could not get it to work.

[amcdnl]

Can you make a plunkr demo?

[adaur]

It seems to work better than yesterday night, I'll investigate.

Still, after one click it should display the first entry only. You have to click several times to make them all go away.

https://plnkr.co/qoJk25kT0o8MbXistXjE

[fedotxxl]

+1 for this request. I've got custom template for rows selection/deselection. It calls component functions to get state (is row selected or not). When I change selection it doesn't refresh templates. How can I force it?

note: I update selected array but it doesn't help...

[amcdnl]

Fixed in 0.3.5 :)

[vkurakula]

how to over ride default message of ngx-table like

@input() messages: any = {
// Message to show when array is presented
// but contains no values
emptyMessage: 'No data to display',

// Footer total message
totalMessage: 'total',

// Footer selected message
selectedMessage: 'selected'

};