How to set 'class' of a column?

[DaveyWaveyParticipant]

Hi,

I’m trying to build a table like the one shown here:

In the ‘columns’ definition on that page it sets the column class to ‘details-control’ so that the CSS renders it with the icon images.

How can I mirror this with jqxDataTable?

Ultimately I want to pull in sub-rows via AJAX when the row is expanded, similar to the example on the linked page.

Thanks,
DW

[DaveyWaveyParticipant]

Note that the first column doesn’t have a title, so no column ‘dataField’ as such.

[Peter StoevKeymaster]

Hi DaveyWavey,

To customize the rendering of a DataTable column, you may use this approach: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdatatable/javascript-datatable-header-template.htm?arctic. Note that with our widget, you need to have a dataField associated to a column.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[DaveyWaveyParticipant]

Thanks for quick response Peter, but I’d taken a look at that example it it’s not what I need.

Having a look through the other examples, it looks like I am looking for a combination of the Data Grouping (javascript-datatable-grouping.htm) and the Master Details (javascript-datatable-nested-tables.htm) examples.

What I want is to initially list ‘parent’ entries, but have an option to expand each entry to show related ‘child’ entries.

The grouping example does the type of grouping I need, but the child entries are already expanded and visible, where I would want them retrieved when the group is expanded – as per the row_details example on datatables.net I linked to.

I also need to have 4 levels of ‘child’ grouping too, each retrieved on a click of it’s parent!

PS. I found the ‘className’ property for the columns[] setting, but that looks like it only sets the class name of the header row. How to set the className of table rows?

Thanks,
DW

[DaveyWaveyParticipant]

Can’t edit my previous post (again). I found the cellClassName property now which sets the required class name on the column of each table row.

My next question is likely to be: ‘How to insert new rows into a table below a clicked row?’

DW

[Peter StoevKeymaster]

Hi DW,

It is possible to add new row only at first or last position.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts