Custom column with AJAX sourced table using Dandelion Datatables

I've been using Dandelion Datatables for a time now with the data attribute.

I've started yesterday using the url attribute and now I'm not able to do custom columns.

I have the following:

<datatables:table id="statesTable" url="/find" pipelining="true" cssClass="table table-striped" pagingType="bootstrap_simple" dom="tip">

  <datatables:column property="name" titleKey="name.label"/>

  <datatables:column titleKey="actions.label">
    <div class="btn-group">
      <spring:url value="update" var="updateUrl">
        <spring:param name="statusId" value="${id}"/>
      </spring:url>
      <a href="${updateUrl}"><fmt:message key="actions.update"/></a>
    </div>
  </datatables:column>

</datatables:table>

Returned data is:

[{"id":7,"createdBy":"pedadmin","createdDate":1449765659000,"name":"Test"},
{"id":8,"createdBy":"pedadmin","createdDate":1449765744000,"name":"Otro"},
{"id":11,"createdBy":"pedadmin","createdDate":1449766460000,"name":"asdfasdfasdf"},
{"id":12,"createdBy":"pedadmin","createdDate":1449766539000,"name":"asañdsfadsfasfdfsad"},
{"id":13,"createdBy":"pedadmin","createdDate":1449766573000,"name":"asdfasdf"}]

And the resulting HTML generated is:

<tbody>
    <tr role="row" class="odd">
        <td class="sorting_1">asañdsfadsfasfdfsad</td><td></td>
    </tr>
    <tr role="row" class="even">
        <td class="sorting_1">asdfasdf</td><td></td>
    </tr>
    <tr role="row" class="odd">
        <td class="sorting_1">asdfasdfasdf</td><td></td>
    </tr>
    <tr role="row" class="even">
        <td class="sorting_1">Cinco</td><td></td>
    </tr>
    <tr role="row" class="odd">
        <td class="sorting_1">Cuatro</td><td></td>
    </tr>
    <tr role="row" class="even">
        <td class="sorting_1">Dos</td><td></td>
    </tr>
    <tr role="row" class="odd">
        <td class="sorting_1">Feo</td><td></td>
    </tr>
    <tr role="row" class="even">
        <td class="sorting_1">Foobar</td><td></td>
    </tr>
    <tr role="row" class="odd">
        <td class="sorting_1">Otro</td><td></td>
    </tr>
    <tr role="row" class="even">
        <td class="sorting_1">Test</td><td></td>
    </tr>
</tbody>

As you can see there is nothing in the td of the custom column. Is there something I need to configure in order to make the custom column work??? (I tested the same column using data instead of url and it works perfectly)

Thank you!

As the datatable is in AJAX mode, everything inside <datatable:column> is not processed (as it should be processed on server and when url is used, it is processed on browser).

So you need to specify a renderFunction and implement it.

Something like this:

<datatables:column titleKey="actions.label" property="id" renderFunction="formatColumn">

And then add the function somewhere on your code (either the same page or a .js file):

function formatColumn(data) {
    var div = $('<div>', {'class': 'btn-group'});

    $('<a>', {href: 'update?statusId=' + data, text:'Update'})appendTo(div);

    return $('<div>').append(div).html();
}