How to sort by rendered data?
How to sort by rendered data?
I want to display details of registered users. The result i get in js for a row is given below.
http://i.imgur.com/sOTCb9d.png
What i need is to display 'companyName' in a column which is in object 'company'.
Code i tried
first case:
[code] {"mDataProp":"company.companyName", "sWidth" :"100px",
"fnRender": function( oObj ) {
if(oObj.aData.company != null)
return oObj.aData.company.companyName;
else
return "";
}
} [/code]
But in the above case if company is null for a user that user's details is not shown in datatable.
second case:
[code] {"mDataProp":"company", "sWidth" :"100px",
"fnRender": function( oObj ) {
if(oObj.aData.company != null)
return oObj.aData.company.companyName;
else
return "";
}
} [/code]
In this all data is shown and companyName column is empty for emty company but the companyName column sort is not working, it sorts as the company object.
Any solutions?
http://i.imgur.com/sOTCb9d.png
What i need is to display 'companyName' in a column which is in object 'company'.
Code i tried
first case:
[code] {"mDataProp":"company.companyName", "sWidth" :"100px",
"fnRender": function( oObj ) {
if(oObj.aData.company != null)
return oObj.aData.company.companyName;
else
return "";
}
} [/code]
But in the above case if company is null for a user that user's details is not shown in datatable.
second case:
[code] {"mDataProp":"company", "sWidth" :"100px",
"fnRender": function( oObj ) {
if(oObj.aData.company != null)
return oObj.aData.company.companyName;
else
return "";
}
} [/code]
In this all data is shown and companyName column is empty for emty company but the companyName column sort is not working, it sorts as the company object.
Any solutions?
This discussion has been closed.
Replies
Allan
case 1: rows with companyName null is not showing
[code]
{"mDataProp":"company.companyName","sWidth" : "100px",
"mRender": function( data, type, val ) {
if(data!= null)
return data;
else
return "";
} }[/code]
case 2: rows are showing correctly, but sorting happens with object(company) and not companyName.
[code]
{"mDataProp":"company","sWidth" : "100px",
"mRender": function( data, type, val ) {
if(data!= null)
return data.companyName;
else
return "";
} }[/code]
can u explain the parameters type and val? what are they used for?
http://www.datatables.net/ref#mRender
Allan
my whole code for the table.
[code]
oUserTable = $('#user-table').dataTable(
{
"sAjaxSource" : "loadUserTable.html",
"bServerSide" : true,
"bProcessing": true,
"aoColumns":[
{"mDataProp":"login","sWidth" : "100px"},
{"mDataProp":"company","sWidth" : "100px",
"mRender": function( data, type, val ) {
if(data!= null)
return data.companyName;
else
return "";
} },
{"mDataProp":"firstName","sWidth" : "100px"},
{"mDataProp":"lastName","sWidth" : "100px"},
{"mDataProp":"country.countryName","sWidth" : "100px"},
{"mDataProp":"city","sWidth" : "100px"},
{"mDataProp":"state","sWidth" : "100px"},
{"mDataProp":"referredBy","sWidth" : "100px"},
{"mDataProp":"phone","sWidth" : "130px"},
{"mDataProp":"mobile","sWidth" : "130px"},
{"mDataProp":"email","sWidth" : "270px"},
{"mDataProp":"taxId","sWidth" : "100px"},
{"mDataProp":"locked","sWidth" : "50px","fnRender" : function(oObj) {
var locked="Unlocked";
if(oObj.aData.locked=='T') {
locked="Locked";
}
return locked;
}},
{"mDataProp":"userType","sWidth" : "50px","fnRender" : function(oObj) {
var locked=""
if(oObj.aData.userType=='asp') {
locked="Issuer";
}else if(oObj.aData.userType=='iinv') {
locked="Institutional Investor";
}else if(oObj.aData.userType=='ainv') {
locked="Accredited Investor";
}else if(oObj.aData.userType=='ic') {
locked="IC Member";
}else if(oObj.aData.userType=='banker') {
locked="Banker";
}else if(oObj.aData.userType=='admin') {
locked="Admin";
}
return locked;
}},
{"mDataProp":"affiliateName","sWidth" : "120px"},
{"mDataProp":"phoneCountryCode","bVisible" : false},
{"mDataProp":"mobileCountryCode","bVisible" : false},
{"mDataProp":"receivedNDA","bVisible" : false},
{"mDataProp":"userAgreement","bVisible" : false}
],
"fnRowCallback" : function(nRow, aData, iDisplayIndex) {
if (aData.country.Country_Code == 'US' || aData.country.Country_Code == 'CA') {
var formattedPhone = aData.phone.replace(
/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3');
$('td:eq(8)', nRow).html(
aData.phoneCountryCode + " " + formattedPhone);
} else {
$('td:eq(8)', nRow).html(aData.phoneCountryCode + " " + aData.phone);
}
if (aData.mobileCountryCode != null) {
$('td:eq(9)', nRow).html(aData.mobileCountryCode + " " + aData.mobile);
}
return nRow;
},
"aaSorting" : [ [ 18, "asc" ] ],
"sScrollY": "280px",
"sScrollX": "100%",
"sPaginationType" : "full_numbers",
"sDom" : '<"top"l>rt<"bottom"ip>'
});
[/code]
the whole code. everything else except the companyName column is working. what i need is a blank field in companyName column if the object company is null.
Allan