Problem with multiple child rows

Problem with multiple child rows

ChrisDennisChrisDennis Posts: 12Questions: 5Answers: 0

I'm trying to display rows with multiple children, where each child has the same row structure as the parent.

Something like this:

boo         |  far
------------------
Something   |   42           (main row)
 one        |    1           (child 1)
 two        |    2           (child 2)

That's OK with a single child, but when I give it an array of children, they end up with the whole row in the first td cell.

See this fiddle

I've tried supplying the child rows as strings e.g. '<tr><td>one</td><td>1</td></tr>' and also as jQuery nodes, but the same problem occurs.

The documentation for row.child() seems to say that it should work when supplying nodes.

What am I doing wrong?

This question has accepted answers - jump to:

Answers

  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Answer ✓

    Thanks for the JS Fiddle!

    So the problem here is that you have an array of jQuery objects. DataTables will cope with an array of nodes, or a jQuery object of elements, but not an array of jQuery instances (as it looks like a 2D array).

    The way to fix this is to simply pass in a single jQuery object that contains all of your nodes: http://jsfiddle.net/787t0vvd/7/ .

    What really caught me out here is that $().add() doesn't add to the current object, it adds to a new object, so you need to assign childNodes in the loop!

    Allan

  • ChrisDennisChrisDennis Posts: 12Questions: 5Answers: 0

    Thank you -- now it works perfectly!

    Perhaps the documentation could be clarified. It says:

    array - Multiple child rows can be added at a single time by passing any of the above options in as an array. For example you might pass in an array with two string elements in it to create two child rows with the string content used for each.

    'any of the above' implies that it will accept an array of jQuery objects, but you're saying that it only accepts one jQuery object that can contain multiple rows.

    Actually, I thought I was using an array of 'nodes' rather than an array of jQuery objects -- perhaps there's not much difference between the two.

    Cheers,

    Chris

  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Answer ✓

    For an array of nodes you would have had to use childNodes.push($(c)[0]); (i.e. get the node, not the jQuery object).

    I'm still trying to decide if I should just note this in the documentation, or change the code...!

    Allan

  • ChrisDennisChrisDennis Posts: 12Questions: 5Answers: 0

    Hello Allan

    Have you decided yet whether it's the documentation or the code that needs changing?

    Chris

  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Answer ✓

    Gosh yes, sorry for the delay on this! A bug in the code - I've committed the fix and it will be in 1.10.6 :-)

    Thanks for flagging this up and the prompt!

    Allan

  • ChrisDennisChrisDennis Posts: 12Questions: 5Answers: 0

    Excellent! Thanks for that.

This discussion has been closed.