2016-12-26 3 views
0

Следующий код теперь показывает имена столбцов в таблице данных, когда «столбцы», поданные из datatables, установлены в «colArray», но он показывает, когда он установлен в «colname1». Может ли кто-нибудь помочь, чего мне здесь не хватает?имя столбца, не отображаемое в datatables

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet"> 
 
    <script src="//code.jquery.com/jquery-1.12.4.js"></script> 
 
    <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> 
 

 
</head> 
 

 
<body> 
 
    <script> 
 
    var dataSet = [ 
 
     ["Tiger", "10", "20", "51", "3", "2", "1"], 
 
     ["Hyena","10","20","51","3","2 ","1 "]]; 
 

 

 
     var colname1= [ 
 
       { title: "Column0 " }, 
 
       { title: "column1 " }, 
 
       { title: "column2 " }, 
 
       { title: "column3 " }, 
 
       { title: "column4 "}]; 
 

 
     colArray = new Array(); 
 
     colArray.push({Values : " Name "}); 
 
     $.each(colname1, function(index, value){ 
 
      colArray.push({Values : colname1[index].Values}); 
 
     }); 
 
     colArray.push({Values : "lastcol"}); 
 

 
     $(document).ready(function() { 
 

 
      var t = $('#example').DataTable({ 
 
       data: dataSet, 
 
       columns:colArray 
 
       //columns: colname1 
 
      }); 
 

 

 
     }); 
 
    </script> 
 

 
    <div> 
 
    <table width="300" class="display" id="example"></table> 
 
    </div> 
 

 

 
</body> 
 

 
</html>

ответ

1

The columns должно быть так:

columns: [ 
    { title: "Name" }, 
    { title: "Position" }, 
    { title: "Office" }, 
    { title: "Extn." }, 
    { title: "Start date" }, 
    { title: "Salary" } 
] 

Но вы дали Values. Смотрите этот фрагмент кода:

var dataSet = [ 
 
    ["Tiger", "10", "20", "51", "3", "2", "1"], 
 
    ["Hyena", "10", "20", "51", "3", "2 ", "1 "] 
 
]; 
 
var colname1 = [{ 
 
    title: "Column0" 
 
}, { 
 
    title: "column1" 
 
}, { 
 
    title: "column2" 
 
}, { 
 
    title: "column3" 
 
}, { 
 
    title: "column4" 
 
}]; 
 

 
colArray = []; 
 
colArray.push({ 
 
    title: "Name" 
 
}); 
 
$.each(colname1, function(index, value) { 
 
    colArray.push({ 
 
    title: value.title 
 
    }); 
 
}); 
 
colArray.push({ 
 
    title: "lastcol" 
 
}); 
 

 
$(document).ready(function() { 
 
    var t = $('#example').DataTable({ 
 
    data: dataSet, 
 
    columns: colArray 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet"> 
 
<script src="//code.jquery.com/jquery-1.12.4.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> 
 
<div> 
 
    <table width="300" class="display" id="example"> 
 
    <thead></thead> 
 
    <tbody></tbody> 
 
    </table> 
 
</div>

Просмотр

preview

+0

Благодаря это работает. Таким образом, означает ли это, что datables забирают «заголовок», а не «Значения» при поиске имен столбцов в массиве? –

+1

@visual_learner Datatable нуждается в определенном формате. Вы не можете изменить это. Хотелось бы принять мой ответ, да, это так. ':)' Нажмите кнопку галочки рядом с моим ответом. –

Смежные вопросы