Cannot read property 'row' of undefined" error

Cannot read property 'row' of undefined" error

rangaranga Posts: 31Questions: 12Answers: 2

Im trying to update cell based on a dropdown value as below. but i keep getting "Uncaught TypeError: Cannot read property 'row' of undefined" error.

number of solutions i referenced said it cause by older version but im using //cdn.datatables.net/1.10.17/

`` function getselect() {

    var d = $("#optsl option:selected").val();
    table.row(this, celIId).data(d).draw();

}

 var table = document.getElementById("#example");

my Drop Down
` "columnDefs": [{

            "targets": -1,
            "render": function (meta) {
                return "<select id='optsl' onchange='getselect(this)'><option value='0'>Select Header</option><option value='1'>Client</option></select>"

            }`

How to get rid of this? or is there any other way for me to achive this?

This question has an accepted answers - jump to answer

Answers

  • rangaranga Posts: 31Questions: 12Answers: 2
    Answer ✓

    Porblem was calling getselect function before datatatable object finishes render .
    moving it to under on change event solved it . many thanks to charlietfl.

    `$(document).ready(function() {

    function getSelectOptions(value) {
    var select = $("<select><option value='0'>Select Header</option><option value='1'>Client</option><option value='2'>Date</option><option value='3'>Date period</option><option value='4'>Topic</option><option value='5'>Full Total</option><option value='6'>Tax Total</option><option value='7'>Comment1</option><option value='3'>Comment2</option></select>");
    if (value) {
    select.val(value).find(':selected').attr('selected', true);
    }
    return select.html()
    }

    var table = $('#example').DataTable({
    data: array,
    "columnDefs": [{

      "targets": -1,
      "render": function(data, type, row, meta) {
        return "<select class='mySelect' data-col='" + meta.col + "'>" +
                getSelectOptions(data) + "</select>";
      }
    }],
    

    });

    $('#example').on('change', 'select.mySelect', function() {
    var colIndex = +$(this).data('col')
    var row = $(this).closest('tr')[0];
    var data = table.row(row).data();
    data[colIndex] = this.value
    data[colIndex-1] = $(this).find(':selected').text();
    table.row(row).data(data).draw();
    })
    });
    `

This discussion has been closed.