Wątek przeniesiony 2018-04-06 20:23 z C# i .NET przez Ktos.

Datatables.net - cały czas wyświetla dane z inicjalizacji

0

Witam.
Wyświetlam listę dokumentów z mojego API. Generuje tabele za pomocą *ngFor i podczas pierwszego wyświetlenia wszystko działa prawidłowo, problem zaczyna się gdy zmienię typ dokumentu. Na starcie wyświetlam faktury, gdy zmienię na wz'tki, dalej są faktury. Dane z API dostaje poprawne (załącznik).

ngOnInit() {
        this.router.params.subscribe((parameter) => {
            this.api.GetDocuments(parameter['documentType']).subscribe((result: any[]) => {
                this.documents = result;
                console.log(this.documents);
            },
                (error) => console.log(error),
                () => {
                    setTimeout(function () {
                        $('#datatable').DataTable({
                            "language": {
                                "lengthMenu": "Wyświetl _MENU_ rekordów na stronę",
                                "zeroRecords": "Nie znaleziono szukanych rekordów",
                                "info": "Strona _PAGE_ z _PAGES_",
                                "infoEmpty": "Rekordy nie są dostępne",
                                "infoFiltered": "(filtered from _MAX_ total records)",
                                "search": "Szukaj...",
                                "paginate": {
                                    "first": "pierwsza",
                                    "last": "ostatnia",
                                    "next": "następna",
                                    "previous": "poprzednia"
                                }
                            },
                            pageLength: 10,
                            fixedHeader: true,
                            responsive: true,
                            "sDom": 'rtip',
                            destroy: true,
                            columnDefs: [{
                                targets: 'no-sort',
                                orderable: false
                            }]
                        });

                        var table = $('#datatable').DataTable();
                        $('#key-search').on('keyup', function () {
                            table.search(this.value).draw();
                        });
                        $('#type-filter').on('change', function () {
                            table.column(4).search($(this).val()).draw();
                        });
                    }, 30);
                });
        });
    }
<tr *ngFor="let document of documents">
                            <td>#</td>
                            <td>
                                {{document.Numer}}
                            </td>
                            <td>{{document.Data | date:"yyyy-MM-dd"}}</td>
                            <td>{{document.Magazyn}}</td>
                            <td>
                                {{document.PodmiotNazwa}}
                            </td>
                            <td>{{document.PodmiotMiasto}}</td>
                            <td>{{document.RazemNetto}}</td>
                            <td>{{document.RazemBrutto}}</td>
                            <td>
                                <a class="text-muted font-16" href="javascript:;"><i class="ti-trash"></i></a>
                            </td>
                        	</tr>		

Robiłem już table.destroy(). Próbowałem załadować dane za pomocą $('#datatable').DataTable({ data: this.documents }), rzucało błędami o parametrze 0 row 0 column 0. Zrobiłem columnDefs, ale niestety nic nie chce działać. Czy datatables nie działa za dobrze z Angularem? Co mam zrobić?

0

Dlaczego mieszasz jQuery z Angularem?

0

To jest gotowy kupiony szablon pod angular. Domyślam się, że autor zrobił najpierw wersje html, a później tylko wcisnął go do angulara, bo... bo tak.

0

Mogę prosić o przeniesienie do działu Webmastering bądź podobnych. Nie wiem czemu wrzuciłem to tutaj ಠ~ಠ

0

jQuery słabo "współpracuje" z Angularem.
Po zmianie danych z tego co widzę na ich stronie to usuwają ten grid i tworzą nowy

0

Po kilkuset próbach czegokolwiek zadziałało $('#datatable').dataTable().fnDestroy(); Najwyraźniej jest różnica pomiędzy .dataTable() a .DataTable()

1 użytkowników online, w tym zalogowanych: 0, gości: 1