Cells are not triggered in edit event in editor Uncaught ReferenceError: table is not defin

Minsa

is my code

 var editor;
    var tabla;

    $(document).ready(function () {

        editor = new $.fn.dataTable.Editor({

            @*ajax: {

                edit: {
                    type: 'POST',
                    url: '@Url.Action("ClientesNuevos", "ClientesProspectosCom")'
                },
            },*@
            ajax: '@Url.Action("ClientesNuevos", "ClientesProspectosCom")',
            table: "#example",
            idSrc: 'Id',
            fields: [{
                label: "Id",
                name: "Id"
            }, {
                label: "Nombre",
                name: "Nombre"
            }, {
                label: "Paterno",
                name: "Paterno"  /// chingon este wey
            }
            ]//,
            //formOptions: {
            //    inline: {
            //        onBlur: 'submit'
            //    }
            //}
        });

        $('#example').on('click', 'tbody td.row-edit', function (e) {
            editor.inline(table.cells(this.parentNode, '*').nodes(), {
                submitTrigger: -2,
                submitHtml: '<i class="fa fa-play"/>'
            });
        });

        $('#example').on('click', 'tbody td.row-remove', function (e) {
            editor.remove(this.parentNode, {
                title: 'Delete record',
                message: 'Are you sure you wish to delete this record?',
                buttons: 'Delete'
            });
        });

        tabla = $('#example').DataTable({
            bInfo: false,
            resposive: true,
            "scrollX": true,
            language: {
                "search": "Busqueda",
                "emptyTable": "No existe el registros con los criterios seleccionados",
                "sNext": "Sig",
                "sPrevious": "Ant"
            },
            dom: 'Bfrtip',
            pageLength: 10,
            columns: [
                { data: "Id", visible: true, orderable: true },
                { data: "Nombre", visible: true, orderable: true },
                { data: "Paterno", title: "Paterno", visible: true, orderable: true },
                {
                    data: null,
                    defaultContent: 'edit',
                    className: 'row-edit dt-center',
                    orderable: false,
                    visible: true
                },
                {
                    data: null,
                    defaultContent: '<i class="fa fa-trash"/>',
                    className: 'row-remove dt-center',
                    orderable: false,
                    visible: true
                },
            ],
            select: {
                style: 'os',
                selector: 'td:first-child'
            },
            buttons: [{
                extend: "createInline",
                editor: editor,
                formOptions: {
                    submitTrigger: -2,
                    submitHtml: '<i class="fa fa-play"/>'
                }
            }]
        });

    });

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

kthorngren

You have

    $('#example').on('click', 'tbody td.row-edit', function (e) {
        editor.inline(table.cells(this.parentNode, '*').nodes(), {
            submitTrigger: -2,
            submitHtml: '<i class="fa fa-play"/>'
        });
    });

In line 2 you are using table.cells(...). You don't have a variable table. You are using tabla. Change table to tabla.

Kevin