JQuery DataTables предотвращает действия в первой строке

Question

Я использую плагин для моего проекта. Теперь то, что я пытаюсь сделать, совершенно уникально, и я не слишком уверен, как это сделать. В основном в моей таблице данных самая первая строка всегда будет относиться к зарегистрированному пользователю. Поэтому при сортировке, разбиении на страницы и поиске я бы хотел, чтобы эта строка была последовательной и никогда не перемещалась и не исчезала. Было бы неплохо, если бы я мог применить его ко второй строке, поэтому у меня могла быть какая-то вроде разделительной строки между личной строкой и остальными данными.

Как я могу подойти к этому?

EDIT:

fiddle, это показывает теперь таблица давайте предположим, я Mike Man, я хотел бы быть в верхней части таблицы в любое время. Во время поиска, разбиения на страницы и сортировка.

я назвал в функции, как это:

$(document).ready(function() { 
    $("#dataTable").dataTable(); 
}); 

, но я жду, что мне нужно, чтобы настроить его для того, что я хочу.

Answer 1

Вы можете сделать это очень легко, выделив <thead><tr>, как всегда видно «строка пользователя». Объявляем дополнительный ряд в <thead>:

<tr id="userRow"> 
    <th></th> 
    <th></th> 
    ... 
</tr> 

Дайте первоначально <thead><tr> идентификатор #sortRow. В initComplete popuplate #userRow с содержанием первого ряда, и поменять местами два <thead><tr> «S:

initComplete : function() { 
    this.api().row(0).data().forEach(function(str, i) { 
     $("#userRow th:eq("+i+")").text(str); 
    })   
    $("#userRow").before($("#sortRow")); 
}  

демо ->http://jsfiddle.net/my577xu4/

В вашем случае вы могли бы сделать точно такой же, но ваш комплекс вложенных таблиц и действительно закрывающий CSS, который стилирует содержимое, требует дополнительной корректировки вручную:

initComplete : function() { 
    $("#userRow th:eq(0)").html(this.api().row(0).column(0).nodes().to$().html()); 
    $("#userRow th:eq(1)").html(this.api().row(0).column(1).nodes().to$().html()); 
    $("#userRow").before($("#sortRow")); 
} 

al al большинство, но некоторые C делают фиолетовый круг плавать вокруг, и вы должны стили скопированной вложенную <table> структуры, а также ->https://jsfiddle.net/zukbrc57/1/ - Я не смею, чтобы попробовать возиться с такой детальной планировкой :)

Answer 2

Сохраните первую строку, в которой вы хотите всегда находиться в переменной, например var row;. Предположим, что ваша таблица данных имеет класс .data-table или любой другой селектор, который вы хотите использовать для него. Создайте свой разбитый на страницы таблицы, как обычно, без первой строки. После этого вы можете использовать метод prepend() JQuery на каждой странице в скрипте, чтобы добавить эту строку в таблицу следующим образом:

$('.data-table').prepend(row);

Если вы хотите добавить разделитель после этого, просто добавьте его в конец переменной row.