myTable.row is not a function when using row().edit

alohas

Hi,

I am keep getting error - "myTable.row is not a function" and I have no clue how to fix it.

I tried to use both DataTable and dataTable, not helping.

$(document).ready( function () {
  
    var currentUser = _spPageContextInfo.userId;
    generateTable(currentUser);

});


function generateTable(currentUser){
    var JsonObject;
    var employees = [];

    $('#table_id').DataTable({
        dom: 'frtBip',
        select: "multi",
        ajax: {
            url: "RestAPI call"
            type: "GET",
            headers:
        {

            "Accept": "application/json;odata=verbose"
        },
            dataSrc: function (data) {
                var dataresults = data.d.results;
                
                for (var i = 0; i < dataresults.length; i++) {
                    // console.log(dataresults[i])['Title'];
                    //testArray.push(dataresults[i]['Title']);
                    console.log(dataresults[i]);

                    employees.push({firstName:dataresults[i]['FirstName'],lastName:dataresults[i]['LastName'],position:dataresults[i]['Position'],salary:dataresults[i]['Salary']})
                    
                }
                JsonObject = JSON.parse(JSON.stringify(employees));
                // console.log(JsonObject);


                return JsonObject;

            },
            dataType: "JSON",

            error: function (xhr, status, error) {
                console.log("Failed");
            },
            

        },
        columnDefs: [{
            "defaultContent": "-",
            "targets": "_all"
        },
    ],
    columns: [
        {data: 'firstName'},
        {data: 'lastName'},
        {data: 'position'},
        {data: 'salary'}
    ],
        buttons: [{
            text: 'Yes',
            action: function (){
                console.log('test');
            }
        }]

    });


    var myTable = $('#table_id').DataTable();
 
    $('#table_id').on( 'click', 'tbody tr', function () {
        myTable.row( this ).edit();
    } );
}

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

rf1234

You need Editor for this but I don't see your Editor initialization.

I always edit existing rows using the select extension by the way. That makes it a lot easier - but of course this also requires Editor.

kthorngren

I would move line 59 (var myTable = $('#table_id').DataTable();) inside your click event.

Kevin

alohas

@rf1234 I tried to use Editor initialization but I get the error - "$.fn.DataTable.Editor is not a constructor"
Do I need to purchase a license in order to use Editor?

kthorngren

Do I need to purchase a license in order to use Editor?

You can download a trial version but after the trial is over you need to purchase a license. You actually need to Download Editor to use in a trial and to run the licensed version. I think you get the above error if you try loading Editor via CDN.

Kevin

allan

myTable.row is not a function

With the code:

    $('#table_id').on( 'click', 'tbody tr', function () {
        var myTable = $('#table_id').DataTable();
        myTable.row( this ).edit();
    } );

And Editor not loaded I would expect the error to be that edit is not a function. By your subject title says that row is not a function. It certainly should be there.

Could you confirm for us please?

Allan