Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 81916

Uncaught TypeError: Cannot read property 'nodeName' of undefined

$
0
0

Hi,

I am using Editor Inline Editing with the multi-select outside the editor to filter the rows.

The Inline Editing works fine without triggering the multi-select onChange event as I can click into each cell to perform the inline editing.

The line editing gave me the attached error when I triggered the onChange event of multi-select to perform the filtering.

The code for the multiselect is below:

var editor;
var oTable;

$('#pmandtechnicians').multiselect({
selectAllValue: 'multiselect-all',
enableCaseInsensitiveFiltering: true,
enableFiltering: true,
onChange: function () {
selected1 = $('#pmandtechnicians').val();
console.log(selected1);
$('#selectedPMandTechnicians').val(selected1);
InitTable(editor, oTable);
}
});

The InitTable(editor, oTable) code is here:

function InitTable(editor, oTable) {
var projectTaskActions = urlactions.init('@Url.RouteUrl(new { area = "", controller = "Project" })/{action}/{id}');

            var taskStatus = [{ "label": "Not Applicable", "value": "0" },
                        { "label": "Not Required", "value": "1"},
                        { "label": "Started", "value": "2"},
                    { "label": "Complete", "value": "3"},
                    { "label": "High Priority", "value": "4"}];

            var closedStatus = [{ "label": "Not Applicable", "value": "0" },
                    { "label": "Complete", "value": "3"},
                    { "label": "High Priority", "value": "4"}];

            oTable = $('#projecttasks').DataTable({
                "dom": "Bfrtip",
                "destroy": true,
                "lengthMenu": [[10, 20, 25, 50, -1], [10, 20, 25, 50, "All"]],
                "fixedHeader": {
                    headerOffset: 50
                },
                "search": {
                    "caseInsensitive": true
                },
                "fnRowCallback": function (nRow, aData) {
                    var isClosed = aData.Task17; // ID is returned by the server as part of the data
                    var $nRow = $(nRow); // cache the row wrapped up in jQuery
                    if (isClosed == 3) {
                        $nRow.css({ "background-color": "LightBlue" })
                    }
                    return nRow
                },
                "stateSave": true,
                "iDisplayLength": -1,
                "order": [[ 1, "asc" ]],
                "processing": true,
                "serverSide": true,
                "ajax": {
                    "url": "@Url.HttpRouteUrl("ActionApi", new { controller = "ProjectTask", action = "GetProjectTasks", area = "" })",
                    "data": { pmandtechnicians: $('#pmandtechnicians').val(), roles: $('#roles').val() },
                    "type": "POST"
                },
                "select": {
                    style:    'os',
                    selector: 'td:first-child'
                },
                "columns": [
                    {
                        "data": "ProjectSource",
                        "render":
                            function (data, type, row) {
                                    return projectTaskActions.renderUrls([
                                    { id: row.ProjectId, action: 'Edit', glyph: 'edit', title: "Edit project", class: "edit-project showDialog" },
                                    { id: row.ProjectId, action: 'Detail', glyph: 'search', title: "View Details", class: "view-details showDialog" }
                                      ]);
                                    ]);
                                }
                            },
                        "sortable": false,
                        "class": "grid-actions"
                    },
                    { "data": "ProjectNumber" },
                    { "data": "ProjectName" },
                    {
                        "data": "Task1",
                        "editField": "Task1",
                        "render": function (data, type, row) {
                            if (type === 'display') {
                                return getIconByData(data);
                            }
                            return data;
                        }
                    },
                    {
                        "data": "Task2",
                        "editField": "Task2",
                        "render": function (data, type, row) {
                            if (type === 'display') {
                                return getIconByData(data);
                            }
                            return data;
                        }
                    },
                    {
                        "data": "Task3",
                        "editField": "Task3",
                        "render": function (data, type, row) {
                            if (type === 'display') {
                                return getIconByData(data);
                            }
                            return data;
                        }
                    },
                    { "data": "Notes",  "editField": "Notes", className: "color-red"  }
                ]
            });

            editor = new $.fn.dataTable.Editor( {
                "ajax": {
                    "url": "@Url.HttpRouteUrl("ActionApi", new { controller = "ProjectTask", action = "GetProjectTasks", area = "" })",
                    "type": "POST"
                },
                table: "#projecttasks",
                idSrc:  "Id",
                fields: [ {
                    label: "Task1",
                    name: "Task1",
                    type: "select",
                    ipOpts: taskStatus
                }, {
                    label: "Task2",
                    name: "Task2",
                    type: "select",
                    ipOpts: taskStatus
                }, {
                    label: "Task3",
                    name: "Task3",
                    type: "select",
                    ipOpts: taskStatus
                }, {
                    label: "Notes",
                    name: "Notes"
                }
                ]
            } );

            $('#projecttasks').on( 'click', 'tbody td:not(:first-child)', function (e) {
                editor.inline( oTable.cell(this).index(), {
                    onBlur: 'submit'
                } );
            } );
        }

Please help to identify what is the issue here.

Thanks,


Viewing all articles
Browse latest Browse all 81916

Trending Articles