datatable: failed to retrieve row data

datatable: failed to retrieve row data

zipperzipper Posts: 35Questions: 9Answers: 0
edited March 2017 in Free community support

I used bellow to display extra contents out of the datatable for a selected row since there were too many fields to fit in the table:

        if (json.show_extra_contents) {
          $('#tbody1').on('click', function () {
            var row = table.row($(this).closest('tr'));
            $('#information').empty();
            for (var i = 0; i < json.tb_fields.length; i++) {
              $('#information').append(json.tb_titles[i] + ': ' + row.data()[json.tb_fields[i]] + '<br>');
            }
          });
        }

and it returned error:
"Uncaught TypeError: Cannot read property 'customer.id' of undefined"
The test case is at 54.199.175.35/5 --> "Customer Mgmt" please help, thanks.

This question has an accepted answers - jump to answer

Answers

  • zipperzipper Posts: 35Questions: 9Answers: 0
    edited March 2017

    I made it work by:

            if (json.show_extra_contents) {
              $('#tbody1').on('click', function () {
                $('#information').empty();
                for (var i = 0; i < json.tb_fields.length; i++) {
                  $('#information').append(json.tb_titles[i] + ': ' + table.row({selected: true}).data()[json.tb_fields[i]] + '<br>');
                }
              });
            }
    
  • kthorngrenkthorngren Posts: 21,342Questions: 26Answers: 4,954
    edited March 2017

    Looks like you fixed your issue while I was responding :-)

    Kevin

  • zipperzipper Posts: 35Questions: 9Answers: 0
    edited March 2017

    Thanks for the quick response @kthorngren, Actually now I changed the code to:

    if (json.show_extra_contents) {
      $('#tbody1').on('click', function () {
        $('#information').empty();
        var tb = table.row({selected: true}).data()[json.tb_name];
        var keys = Object.keys(tb);
        for (var i = 0; i < json.tb_fields.length; i++) {
          $('#information').append(json.tb_titles[i] + ': ' + tb[keys[i]] + '<br>');
        }
      });
    }
    

    And now the problem is no matter which row I click, it only shows the contents of the first row. May you take a look at the test case 54.199.175.35/6

  • kthorngrenkthorngren Posts: 21,342Questions: 26Answers: 4,954
    edited March 2017 Answer ✓

    I believe that you will need to use the select extension in order for selected: true in table.row({selected: true}) to work.

    Another option, not requiring additional JS, to get the data from the selected row is this:

    var tb = table.row($(this)).data();
    

    EDIT: almost forgot you probably need to change your click event to:
    .on('click', 'tbody tr', function ()

    Kevin

  • zipperzipper Posts: 35Questions: 9Answers: 0

    With these together it finally worked. thank you for support Kevin.

This discussion has been closed.