Permalink
Browse files

Update: Examples - remove all reference of fnRender, instead granting…

… preference to mRender.
  • Loading branch information...
1 parent 880de42 commit f6401f062a2db78e740d3be0fca967b33117b4b0 @DataTables committed Sep 9, 2012
View
17 examples/advanced_init/column_render.html
@@ -16,8 +16,11 @@
$('#example').dataTable( {
"aoColumnDefs": [
{
- "fnRender": function ( oObj, sVal ) {
- return sVal +' '+ oObj.aData[3];
+ // `data` refers to the data for the cell (defined by `mData`, which
+ // defaults to the column being worked with, in this case is the first
+ // Using `row[0]` is equivalent.
+ "mRender": function ( data, type, row ) {
+ return data +' '+ row[3];
},
"aTargets": [ 0 ]
},
@@ -35,7 +38,8 @@
</div>
<h1>Preamble</h1>
- <p>You may specify a function for each column to render the available data in a specific manner which will be called when the table is drawn. In this example I've appended the rendering engine version to the rendering engine name in the first column, and hidden the version column.</p>
+ <p>Each column has an optional rendering control called <a href="http://datatables.net/ref#mRender">mRender</a> which can be used to process the content of each cell before the data is used. <code>mRender</code> has a wide array of options available to it for rendering different types of data (sorting, filtering, display etc), but it can be used very simply to manipulate the content of a cell, as shown here.</p>
+ <p>This example shows the rendering engine version combined with the rendering engine name in the first column, hiding the version column. This technique can be useful for adding links, assigning colours based on content rules and any other form of text manipulation you require.</p>
<h1>Live example</h1>
<div id="demo">
@@ -469,8 +473,11 @@
$('#example').dataTable( {
"aoColumnDefs": [
{
- "fnRender": function ( oObj, sVal ) {
- return sVal +' '+ oObj.aData[3];
+ // `data` refers to the data for the cell (defined by `mData`, which
+ // defaults to the column being worked with, in this case is the first
+ // Using `row[0]` is equivalent.
+ "mRender": function ( data, type, row ) {
+ return data +' '+ row[3];
},
"aTargets": [ 0 ]
},
View
2 examples/advanced_init/row_callback.html
@@ -36,7 +36,7 @@
</div>
<h1>Preamble</h1>
- <p>The following example shows how a callback function can be used to format a particular row at draw time. For each row that is generated for display, the <b>fnRowCallback()</b> function is called. It is passed the row node which can then be modified. In this case a trivial example of making the 'grade' column bold if the grade is 'A' is shown (note that this could also be performed using the <b>fnRender()</b> function, but this is just for example).</p>
+ <p>The following example shows how a callback function can be used to format a particular row at draw time. For each row that is generated for display, the <b>fnRowCallback()</b> function is called. It is passed the row node which can then be modified. In this case a trivial example of making the 'grade' column bold if the grade is 'A' is shown (note that this could also be performed using <a href="http://datatables.net/ref#mData">mData</a> as a function, but this is just for example of fnRowCallback!).</p>
<h1>Live example</h1>
<div id="demo">
View
24 examples/data_sources/js_array.html
@@ -82,17 +82,7 @@
{ "sTitle": "Browser" },
{ "sTitle": "Platform" },
{ "sTitle": "Version", "sClass": "center" },
- {
- "sTitle": "Grade",
- "sClass": "center",
- "fnRender": function(obj) {
- var sReturn = obj.aData[ obj.iDataColumn ];
- if ( sReturn == "A" ) {
- sReturn = "<b>A</b>";
- }
- return sReturn;
- }
- }
+ { "sTitle": "Grade", "sClass": "center" }
]
} );
} );
@@ -136,17 +126,7 @@
{ "sTitle": "Browser" },
{ "sTitle": "Platform" },
{ "sTitle": "Version", "sClass": "center" },
- {
- "sTitle": "Grade",
- "sClass": "center",
- "fnRender": function(obj) {
- var sReturn = obj.aData[ obj.iDataColumn ];
- if ( sReturn == "A" ) {
- sReturn = "&lt;b&gt;A&lt;/b&gt;";
- }
- return sReturn;
- }
- }
+ { "sTitle": "Grade", "sClass": "center" }
]
} );
} );</pre>

0 comments on commit f6401f0

Please sign in to comment.