2011-11-29 35 views
0

我想使用jQuery Datatables分页查询,我从数据库中获得。使用的查询涉及很多格式化和连接许多查询,所以我选择构建一个完成的数组,我现在试图为Datatables格式化。jQuery DataTables根据他们的教程没有加载javascript数组

在我HXTML我有jQuery和jQuery的数据表插件加载HXTML看起来是这样的:

<span id='search'> 
</span> 
<script type='text/javascript' > 
$(document).ready(function() { 
    $('#search').html("<table id='search_table' class='tablesorter'></table>"); 
    $('#search_table').dataTable({ 
    'aaData': [ 
    [ 'example status 2', '1', '2011-06-15', '2011-06-15', '2011-06-15', '', 'Bill', 'Father', '1', 'Henry', 'Husband', '1', 'Hamilton Harron Funeral Home', 'Dan Thompson', 'Steve', '1', '2001-05-11', '2', '2003-11-05', 'Non Registrant Test Program - Advantage', '--', '--', '--', 'Onelia', 'Gamboli', 'home', '', 'Houston', 'Texas', '77019', '--', '--', '--', '--', '--', '', 'Pre-Need', 'This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. This is Note 3. ' ] 
    , [ '', '2', '2011-07-02', '2011-07-02', '2011-07-02', '', '--', '--', '--', '--', '--', '--', 'Floral Haven Funeral Home ', 'Jayson Gordon', 'Henry', '3', '2003-12-02', '4', '2004-03-05', 'Non Registrant Test Program - Advantage', '--', '--', '--', 'Leona', 'Brown', 'home', '5110 Rodgewill Rd ', 'Burlington', 'Sussex', '79011', '9023219235', '--', '9026323532', '--', '--', '[email protected]', 'PN to AN', 'This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. This is Note 5. ' ] 
    , [ 'example1 status', '3', '2011-09-05', '2011-09-05', '2011-09-05', '', 'Onelia', 'Wife', '1', '--', '--', '--', 'First Memorial Funeral Services', 'Dan', 'Steve', '5', '2010-11-11', '7', '2011-08-19', 'Non Registrant Test Program - Dignity', '6', '2011-07-03', 'Non Registrant Test Program - Advantage', 'Henry', 'Sale', 'company', '4125 Harvester Rd. 4', 'Sussex', 'Widimer', '72212', '9025229202', '9027205202', '--', '--', '--', '[email protected]', 'At-Need', 'This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. This is Note 6. ' ] 
    ],      
    'aoColumns': [ 
    {  'sTitle': 'Status' } 
    ,{  'sTitle': 'Contact ID Number' } 
    ,{  'sTitle': 'Date Entered' } 
    ,{  'sTitle': 'Date Assigned' } 
    ,{  'sTitle': 'Date Last Modified' } 
    ,{  'sTitle': 'Deceased Date' } 
    ,{  'sTitle': 'Linked To Registrant 1' } 
    ,{  'sTitle': 'Relationship 1' } 
    ,{  'sTitle': 'Authorization 1' } 
    ,{  'sTitle': 'Linked To Registrant 2' } 
    ,{  'sTitle': 'Relationship 2' } 
    ,{  'sTitle': 'Authorization 2' } 
    ,{  'sTitle': 'Location', 'sClass': 'location_cell' } 
    ,{  'sTitle': 'Sales Manager' } 
    ,{  'sTitle': 'Counselor' } 
    ,{  'sTitle': 'Registration Number' } 
    ,{  'sTitle': 'Registration Date' } 
    ,{  'sTitle': 'Program 1 Number' } 
    ,{  'sTitle': 'Program 1 Date', 'sClass': 'program_cell' } 
    ,{  'sTitle': 'Program 1 Name', 'sClass': 'program_cell' }  
    ,{  'sTitle': 'Program 2 Number' } 
    ,{  'sTitle': 'Program 2 Date', 'sClass': 'program_cell' } 
    ,{  'sTitle': 'Program 2 Name', 'sClass': 'program_cell' } 
    ,{  'sTitle': 'First Name' } 
    ,{  'sTitle': 'Last Name' } 
    ,{  'sTitle': 'Address Location 1' } 
    ,{  'sTitle': 'City 1' } 
    ,{  'sTitle': 'State/Province 1' } 
    ,{  'sTitle': 'Zip/Postal Code 1' } 
    ,{  'sTitle': 'Home Phone' } 
    ,{  'sTitle': 'Work Phone' } 
    ,{  'sTitle': 'Mobile Phone' } 
    ,{  'sTitle': 'Pager' } 
    ,{  'sTitle': 'Other Phone' } 
    ,{  'sTitle': 'Sales Type' } 
    ,{  'sTitle': 'Note 1', 'sClass': 'note_cell' } 
    ]     
    }); 
}); 
</script> 

我不知道为什么,因为这数据被格式化几乎完全一样的例子中的数据表不创建一个表这里:Datatable Javascript array example

我想使用DataTable来分页这些数据。

你能看出为什么这不起作用,或者我没有给你足够的支持吗?

回答

1

明确目标<span id="search"></span>(你缺少你的代码示例一些尖括号中)和清洁代码位(你有36列和38个数据点)和它应该工作:

http://jsfiddle.net/fvgAU/1/

+0

喜的一直得到剥离代码或块引用所以我删除足够其格式得到它进入后。我会仔细检查尖括号和数据单元格。谢谢 – ServerStorm

0

似乎或多或少为我工作。我不认为这是问题的初始化,也不是数组。

http://live.datatables.net/ojuhep

将不得不看到它以甚至开始排除故障超出打破了你的一个活生生的例子,我想。看看它的CSS,从其他地方冲突的JS ...

+0

格雷格谢谢你试图在现场表下!我不知道我能做到这一点,但这是极其有益的。 – ServerStorm

+0

有帮助,就是解决这个问题。 – ServerStorm

0

我能够得到这个工作。诀窍是最初我在我的网页底部加载了所有的JavaScript。虽然这通常是很好的做法,但似乎Datatables喜欢在页面顶部加载。也许它是CSS冲突,所以它需要在CSS应用程序之前加载或它可能只是它需要这个?

感谢大家对此的帮助!

问候, 史蒂夫

+0

很高兴听到它的工作。 ;-) –