2016-07-27 3 views
1

Я использую этот плагин на python.jquery tablesorter нестандартный заказ

Можно ли упорядочить колонку пользовательской последовательностью?

В столбце quality я могу иметь только: «низкий», «посредственный», «хороший», «большой», и я хочу упорядочить таким образом (или наоборот).

В Name колонке у меня есть (по мнению) постановление custum, но я хочу, чтобы дать возможность заказать в алфавитном порядке тоже, а затем вернуться на первоначальный заказ ...

views.py Мои:

def aff_list(request): 
    context_dict = {} 
    lista_aff_a=[] 
    lista_aff_s=[] 
    for aff in Aff.objects.all(): 
     if aff.price=='luxury': 
      lista_aff_a.append(aff) 
     elif aff.price=='cheap': 
      lista_aff_s.append(aff) 
    lista_aff=lista_aff_a + lista_aff_s #this way is ordered before lista_aff_a, then lista_aff_s 

    context_dict['lista_aff'] = lista_aff 

return render(request, 'aff_list.html', context_dict) 

Мои aff_list.html:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script src="{% static "js/jquery-tablesorter/jquery.tablesorter.js" %}"></script>  
<link rel="stylesheet" href="{% static "css/tablesorter.css" %}" type="text/css" /> 
<script src="{% static "js/script-jquery.js" %}"></script> 

... 
<div class="panel panel-default"> 
    <table id="lista_aff" class="tablesorter table table-hover table table-bordered table table-condensed"> 
     <thead> 
     <tr> 
      <th>Name</th> 
      <th>Quality</th> 
     </tr> 
     </thead> 

     <tbody> 
     {% for aff in lista_aff %} 
      <tr> 
      <td> 
       {{ aff.name }} 
      </td> 
      <td> 
       {{ aff.quality }}     
      </td> 
      </tr> 
     {% endfor %} 
     </tbody> 
    </table> 
</div> 

Мои script-jquery:

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

Edit:

Последний вопрос:

загрузить файл и распакованный в static/js, то я пишу в голове моего шаблона:

<link href="{% static "js/tablesorter-master/css/theme-blue.css" %}" /> 
<link rel="stylesheet" href="{% static "css/dashboard.css" %}"> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script src="{% static "js/tablesorter-master/js/jquery.tablesorter.js" %}"> 

Для того, чтобы они работают Я должен изменить название темы от theme.# до theme-# и добавить в мой script-jquery.js:

theme : 'blue', 

Просто «синий», а не «тема-синий». Это работает, но, возможно, я делаю что-то неправильно.

+0

Вы пытаетесь сделать заказ столбца на сервере или на стороне клиента? – Mottie

+0

На стороне клиента. – fabio

+1

Вам нужно добавить парсер - [см. Документацию] (http://tablesorter.com/docs/example-parsers.html). – Mottie

ответ

1

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

Мои script-jquery:

$.tablesorter.addParser({ 
    id: 'quality', 
    is: function(s) { 
    // return false so this parser is not auto detected 
    return false; 
    }, 
    format: function(s) { 
    // format your data for normalization 
    return s.toLowerCase().replace(/great/,0).replace(/good/,1 
     ).replace(/mediocre/,2).replace(/low/,3); 
    }, 
    // set type, either numeric or text 
    type: 'numeric' 
}); 

$(document).ready(function() { 

    $("#lista_Aff").tablesorter({  
    theme : 'blue', 
    sortReset : true, 
    headers: { 1: { sorter: 'quality' } } 
    }); 

}); 
Смежные вопросы