Customize sorting of Columns in jQuery DataTable plugin in GridView using in ASP.Net

Last Reply on Apr 19, 2017 02:17 AM By AnandM

Posted on Apr 14, 2017 05:33 AM

Hello Guys,

As i'm using jQuery Datatable to gridview it's working fine. but the problem is i'm, using edit and delete linkbuttons in first column as template field so what i want is to disable sort for first column.

check below screenshot

Screenshot

 

Posted on Apr 17, 2017 02:19 AM

Hi YacharuP,

You can refer below script for disabling the first column sorting for your gridview

jQuery

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.13/datatables.min.css" />
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.13/datatables.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('[id*=YourGridViewId]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
            'aoColumnDefs': [{
                'bSortable': false,
                'aTargets': [0] /* index of the column which you want to disable */
            }]
        });
    });
</script>

 


Posted on Apr 19, 2017 02:17 AM Modified on on Apr 19, 2017 03:02 AM

Hi YacharuP,

You need to add below line of code in your jQuery ready event handler.

you need to remove the class which is getting applied to the TH while rendering into jQuery DataTable because of class the arrow icon gets displayed.

jQuery

$('[id*=YourGridViewId] tr:first').eq(0).find('th').eq(0).removeClass();