2016-07-27 11 views
1

私はこのプラグインをPythonで使用しています。jquery tablesorterカスタムオーダー

カスタムシーケンスで列を並べ替えることはできますか?

qualityの列には、「低」、「普通」、「良い」、「偉大」の3つしかありません。私は(ビューによる)custum順序を持っていますが、私はあまりにもアルファベット順に注文して、元の順序に戻すに可能性を与えたいName列で

...

マイ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(); 
}); 

編集:

最後の質問:

私はその後、私は私のテンプレートの頭に書き込み、ファイルをダウンロードし、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' } } 
    }); 

});