jQuery dataTable sıralama simgesi göstermiyor

Question

jQuery dataTable eklentisini kullanmaya çalışıyorum. Sorun şu ki sıralama simgesi (hangi yön verisinin gerçekte sıralandığı bu ok) görüntülenmiyor.

$('#example').dataTable(
{ 
    "bPaginate": false, 
    "bFilter": false, 
    "oLanguage": { "sInfo": ""}   
} 
); 

ve Html:

<table class="surfClass" cellspacing="1" id="example"> 

<thead> 
<tr> 
    <th width="120px">Name</th> 
    <th width="120px">The hourly rate (points)</th> 
    <th>Levels of referrals</th> 
    <th>bonuses</th> 
    <th width="70px">Payout minimum</th> 
</tr> 
</thead> 

Answer 1

datatables sen hepsinden daha net tıklayıp şey aramak firefox'taki kundakçı kullanmak istediğiniz simgeler için bir sprite kullanır şöyle

Kodum görünüyor kırmızıyla gösteriliyor. Bir varlığın yüklenmediğini gösterir. "/media/css/jui_themes/smoothness/images/ui-icons_888888_256x240.png" gibi bir şeye benziyorsunuz.

Datatable eklentisinin başlatıldığını ve beklediğiniz her şeyi görüyorsunuz.

Bu eklentinin hata ayıklamasına yardımcı olan bir yer imi olan bu http://debug.datatables.net/ adresine bakmak isteyebilirsiniz.

Answer 2

DataTables ile bu sorunla karşılaştığımda, bir javascript hatasından kaynaklanıyor.
Ayrıca, bu sorunu vardı ve ben gerekli biçembente bağlayan olmadığını keşfetmek için bir saatimi aldı

"bSort": true, 

Answer 3

eklemeyi deneyebilirsiniz. Benim durumumda, ben:

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/minidatatables-bootstrap.css'}"/> 

ama ben de eklemek gerekli: sort simgeler için

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/datatables-bootstrap.css'}"/> 

göstermek için. Bu muhtemelen bir bootstrap çözümdür, ancak bu problemi yaşıyorsanız, doğru stil sayfalarını bağladığınızdan emin olabilirsiniz.

Answer 4

Bu sorunu yaşadım, çünkü CDN komut dosyasını yerel makineme kopyaladım çünkü görüntülerin doğru bir şekilde referans gösterilmediğinden @ Matt2012 işaret etti. Öyleyse çözümüm, onları da kaydettikten sonra onları koymak istediğim görüntüleri aramak için CSS dosyasını güncellemekti.

bu bölümü bakınız:

table.dataTable thead .sorting { background: url('/Content/images/sort_both.png') no-repeat center right; } 
table.dataTable thead .sorting_asc { background: url('/Content/images/sort_asc.png') no-repeat center right; } 
table.dataTable thead .sorting_desc { background: url('/Content/images/sort_desc.png') no-repeat center right; } 

table.dataTable thead .sorting_asc_disabled { background: url('/Content/images/sort_asc_disabled.png') no-repeat center right; } 
table.dataTable thead .sorting_desc_disabled { background: url('/Content/images/sort_desc_disabled.png') no-repeat center right; } 

Answer 5

Ben <div> tablo başlık metni sararak sorunu düzeltildi:

<th><div>Date</div></th> 

Answer 6

Ben de sorun vardı. Burada oluşturmak istediğiniz tüm seçenekleri https://datatables.net/download/ kurmak için kendi konfigüratörlerini kullanın, tam olarak ihtiyacınız olan .js ve .css dosyalarını üreteceklerdir. Her iki dosya için de kendi barındırılan CDN'lerini indirebilir veya kullanabilirsiniz.