Add “Editor” to datatable.net in Angular

Add “Editor” to datatable.net in Angular

JFUJFU Posts: 4Questions: 1Answers: 0

I'm getting "Property 'Editor' does not exist on type 'StaticFunctions'." error when initialising a datatables.net-editor. On the other hand i have another problem with the "select" and "buttons" parametres, says don't exist the properties in type 'Settings'.

export class EmpleadosComponent implements OnInit {


constructor() { }

ngOnInit() {
    let  dataSet = [
        ["Pepe", "Tiger Nixon", "System Architect"],
        ["Juan", "Garrett Winters", "Accountant"],
        ["Javier", "Ashton Cox", "Junior Technical Author"],
    ];



    //tabla responsive con las columnas + dataSet
    $(document).ready(function () {
        $('#example').DataTable({
            data: dataSet,
            columns: [
                { title: "Nombre"},
                { title: "Apellidos" },
                { title: "Departamento" },
             ],
            responsive: true
        });
    });
var editor;

$(document).ready(function () {
    editor = new ($.fn.dataTable as any).Editor({  // <-- Editor gives error
        ajax: "../php/staff.php",
        table: "#example",
        fields: [{
            label: "First name:",
            name: "first_name"
        }, {
            label: "Last name:",
            name: "last_name"
        }, {
            label: "Position:",
            name: "position"
        }]
    });

    $('#example').DataTable({
        dom: "Bfrtip",
        ajax: "../php/staff.php",
        columns: [
            {
                data: null, render: function (data, type, row) {
                    return data.first_name + ' ' + data.last_name;
                }
            },
            { data: "position" },
        ],
        select: true,   // <-- from select gives error
        buttons: [
            { extend: "create", editor: editor },
            { extend: "edit", editor: editor },
            { extend: "remove", editor: editor }
        ]
    });
});

I imported all libraries, and did all npm installs. I know datatable.net is not worth for Angular, but should be any way to solve this.

Thanks.

Answers

  • allanallan Posts: 61,452Questions: 1Answers: 10,055 Site admin

    Are these all TypeScript warnings? Does the ($.fn.dataTable as any) you are using resolve the issue?

    We don't provide TypeScript definitions for DataTables and Editor at the moment. That is something that will come done the line.

    Allan

  • chinmaychinmay Posts: 1Questions: 0Answers: 0

    Is there any update on this? I am also searching way to integrate editor for data table in my angular application. There is documentation available on using it through jQuery but could not find one for typescript.

  • allanallan Posts: 61,452Questions: 1Answers: 10,055 Site admin

    We have recently introduced TypeScript typings for all of our libraries and they will be getting rolled out as part of the next update for each piece of software. Many already have been released - for example DataTables core 1.10.22 includes a typing file.

    Allan

This discussion has been closed.