Hi,
I'm new to GUI development, and I'm using the DataTables API to create a table. I have a table with four cells, and the last two cells can have very long strings. Do you know how I can wrap the text in the cells? Currently, the long text just spews across the cells. Here is my current code:
HTML:
<table style="table-layout: fixed" id="downlink-table-nameserver">
<thead>
<td rel="localize[serverPortName]">Server Port Name</td>
<td rel="localize[serverNodeName]">Server Node Name</td>
<td rel="localize[storagePortName]">Storage Port Name</td>
<td rel="localize[storageNodeName]">Storage Node Name</td>
</thead>
</table>
Javascript:
var linkOptions = {
"fnHeaderCallback": function( nHead, aData, iDisplayIndex ) {
$('td:eq(0)', nHead).css("background-color","transparent");
},
"bPaginate" : false,
"bFilter" : false,
"bInfo" : false,
"bAutoWidth" : false,
"aaData" : [],
"aaSorting": [[ 1, "alphanumeric-asc" ]],
"aoColumns" : [
{
"sTitle" : serverPortNameTitle,
"sWidth" : "230px",
"mDataProp" : "serverPortName",
"sType" : "string"
}, {
"sTitle" : serverNodeNameTitle,
"sWidth" : "230px",
"mDataProp" : "serverNodeName",
"sType" : "string"
}, {
"sTitle" : storagePortNameTitle,
"sWidth" : "230px",
"mDataProp" : "storagePortName",
"sType" : "string"
}, {
"sTitle" : storageNodeNameTitle,
"sWidth" : "230px",
"mDataProp" : "storageNodeName",
"sType" : "string"
}
]
};
var table_id = DOWNLINK_NAMESERVER_PORTS_TABLE_ID + '-' + portId;
return $(table_id).dataTable(linkOptions);
Thanks for your help in advance!
I'm new to GUI development, and I'm using the DataTables API to create a table. I have a table with four cells, and the last two cells can have very long strings. Do you know how I can wrap the text in the cells? Currently, the long text just spews across the cells. Here is my current code:
HTML:
<table style="table-layout: fixed" id="downlink-table-nameserver">
<thead>
<td rel="localize[serverPortName]">Server Port Name</td>
<td rel="localize[serverNodeName]">Server Node Name</td>
<td rel="localize[storagePortName]">Storage Port Name</td>
<td rel="localize[storageNodeName]">Storage Node Name</td>
</thead>
</table>
Javascript:
var linkOptions = {
"fnHeaderCallback": function( nHead, aData, iDisplayIndex ) {
$('td:eq(0)', nHead).css("background-color","transparent");
},
"bPaginate" : false,
"bFilter" : false,
"bInfo" : false,
"bAutoWidth" : false,
"aaData" : [],
"aaSorting": [[ 1, "alphanumeric-asc" ]],
"aoColumns" : [
{
"sTitle" : serverPortNameTitle,
"sWidth" : "230px",
"mDataProp" : "serverPortName",
"sType" : "string"
}, {
"sTitle" : serverNodeNameTitle,
"sWidth" : "230px",
"mDataProp" : "serverNodeName",
"sType" : "string"
}, {
"sTitle" : storagePortNameTitle,
"sWidth" : "230px",
"mDataProp" : "storagePortName",
"sType" : "string"
}, {
"sTitle" : storageNodeNameTitle,
"sWidth" : "230px",
"mDataProp" : "storageNodeName",
"sType" : "string"
}
]
};
var table_id = DOWNLINK_NAMESERVER_PORTS_TABLE_ID + '-' + portId;
return $(table_id).dataTable(linkOptions);
Thanks for your help in advance!