заставить первые 5 строк в таблице, чтобы показать с jquery

Question

Я написал вопрос show hide jquery table rows for imported xml data о том, как показать скрыть некоторые строки таблицы, используя jquery, и теперь, используя тот же вопрос, я хочу знать, как заставить первые 5 элементов объявиться. Я использовал следующий код в моем примере:

$(document).ready(function(){ 
$.ajax({ 
    type: "GET", 
    url: "test.xml", 
    dataType: "xml", 
    success: function(xml) { 
    $(xml).find('event').each(function(){  
    var Col0 = $(this).find('title').text(); 
    var Col1 = $(this).find('country').text(); 
    var Col2 = $(this).find('date').text(); 
    var Col3 = $(this).find('time').text(); 
    var Col4 = $(this).find('course').text(); 
    var Col5 = $(this).find('topic').text(); 
    var Col6 = $(this).find('pre-course').text(); 
    $('<tr></tr>').html('<th>'+Col0+'</th><td>'+Col1+'</td><td>'+Col2+'</td><td>'+Col3+'</td><td>'+Col4+'</td><td>'+Col5+'</td><td>'+Col6+'</td>').appendTo('#test'); 
initalizeTable(); 
}); 
    } 
}); 
}); 

и HTML:

<table id="test"> 
     <tr><td></td><th>country</th> 
     <th>Date</th><th>time</th> 
     <th>course</th><th>topic</th> 
      <th>pre-course</th></tr> 
    </table> 

И тогда я использовал JavaScript для отображения только некоторые параметры отображения:

function initalizeTable() { 
function show (min, max) { 
    var $table = $('#test'), $rows = $table.find('tbody tr'); 
    min = min ? min - 1 : 0; 
    max = max ? max : $rows.length; 
    $rows.hide().slice(min, max).show(); 
    return false;  
} 

$('#limit').bind('change', function() { 
    show(0, this.value); 
}); 
} 

я должен был обернуть приведенный выше код, чтобы включить его в первый код, чтобы он загружался непосредственно после импорта данных в html.

и вот HTML я использовал, чтобы изменить режим отображения вручную:

<select id="limit"> 
    <option value="0">None</option> 
    <option value="5"selected>5</option> 
    <option value="10">10</option> 
    <option value="15">15</option> 
    <option value="20">20</option> 
    <option value="" >All</option> 
</select> 

теперь все работает отлично, за исключением того, что данные импортируются в полную таблицу, где я хочу, чтобы заставить показывать только первые 5 строк в таблице.

любая идея, как это сделать ??

Благодаря

Answer 1

Вы могли бы назвать show(0,5); в конце вашей initalizeTable() функции.

Или вызвать ваше событие выбора меняются только после того, как вы свяжете его так, чтобы он автоматически выбирает максимальное значение из текущего выбранного параметра в раскрывающемся по:

$('#limit').bind('change', function() { 
    show(0, this.value); 
}).trigger('change');