Can datatables sort a column with an input field?

For versions of Datatables 1.10+ the names of some option variables have been changed and a new API introduced. Documentation here: http://datatables.net/examples/plug-ins/dom_sort.html.

Here is a working version of the above accepted answer in 1.10+:

$(document).ready(function () {
    var table = $('#example').DataTable({
        "columnDefs": [
            {
                "orderDataType": "dom-input",
                "targets": 0, // Just the first column
            },
        ],
    });
});

The custom sort function:

$.fn.dataTable.ext.order['dom-input'] = function (settings, col) {
    return this.api().column(col, { order: 'index' }).nodes().map(function (td, i) {
        return $('input', td).val();
    });
}

You should look at this example that explains how to do sorting on input fields. Basically you declare a sorting function

/* Create an array with the values of all the input boxes in a column */
$.fn.dataTableExt.afnSortData['dom-text'] = function  ( oSettings, iColumn )
{
    var aData = [];
    $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
        aData.push( this.value );
    } );
    return aData;
}

And then tell to your table to use that

$('#example').dataTable( {
    "aoColumns": [
        null,
        { "sSortDataType": "dom-text" }
    ]
} );

or wit aoColumnDefs

$('#example').dataTable( {
    "aoColumnDefs": [{ "sSortDataType": "dom-text" , aTarget: "yourclass"}]
} );

The easiest way is to add a hidden span inside columns <span style="visibility:hidden">value of the input</span>