jQuery DataTable不显示数据 [英] jQuery DataTable is not showing the data
本文介绍了jQuery DataTable不显示数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
HTML代码:
<! doctype html>
< html lang =tr>
< head>
< meta charset =utf-8>
< title> Binalar< / title>
< link rel =stylesheettype =text / csshref =http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css >
< style type =text / csstitle =currentStyle>
@importhttp://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/css/demo_page.css;
@importhttp://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/css/demo_table.css;
< / style>
< script src =http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/js/jquery.js>< / script>
< script type =text / javascriptlanguage =javascriptsrc =http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/js/jquery.dataTables.js> < / script>
< script type =text / javascriptcharset =utf-8>
$(document).ready(function(){
$('#binalar')。dataTable({
bProcessing:true,
bServerSide
sAjaxSource:http://127.0.0.1/HCAWebApp/index.php/getbuildings
});
});
< / script>
< style>
body {padding:15px 30px; }
.alignleft {float:left; vertical-align:text-bottom; }
.alignright {float:right; vertical-align:text-bottom; }
td {width:25%}
< / style>
< / head>
< body>
< div class =navbar>
< div class =navbar-inner>
< div class =container>
< a class =btn btn-navbardata-toggle =collapsedata-target =。navbar-responsive-collapse>
< span class =icon-bar>< / span>
< span class =icon-bar>< / span>
< span class =icon-bar>< / span>
< / a>
< div class =nav-collapse collapse navbar-responsive-collapse>
< ul class =nav>
< li class ='active'>< a href =binalar> Binalar< / a>< / li>
< li>< a href =cihazlar> Cihazlar< / a>< / li>
< li>< a href =kullanicilar>Kullanıcılar< / a>< / li>
< li>< a href =gruplar> Gruplar< / a>< / li>
< / ul>
< ul class =nav pull-right>
< li class =dropdown>
< a href =#class =dropdown-toggledata-toggle =dropdown>İlhanŞUBAŞI< b class =caret>< / b>< / a>
< ul class =dropdown-menu>
< li>< a href =#> Veritronik< / a>< / li>
< li>< a href =#>卖方< / a>< / li>
< li class =divider>< / li>
< li>< a href =kullanicilar / logout>Çıkış< / a>< / li>
< / ul>
< / li>
< / ul>
< / div><! - /.nav-collapse->
< / div>
< / div><! - / navbar-inner - >
< / div><! - / navbar - >< div class ='fdfg'>
< div id =baslik>
< h1 style =margin-bottom:-15pxclass =alignleft> Binalar< / h1>
< h3 style =margin-bottom:-15pxclass =alignright> + Bina Ekleme< / h3> < / div>
< div style =clear:both;>< / div>
< hr>
< table cellpadding =0cellspacing =0border =0class =displayid =binalar>
< thead>
< tr>
< th>列1< / th>
< th>列2< / th>
< / tr>
< / thead>
< tbody>
< tr>
< td colspan =2class =dataTables_empty> Veriler sunucudanyükleniyor。< / td>
< / tr>
< / tbody>
< / table>
< / div>
< / body>
< / html>
JSON数据,它有 application / json
内容类型。
{aaData:[[Ersin SEewrZA,
/ pre>
eseeza @ veritrwqonik。
],
[İlhanŞUBewrAŞI,
isuqbasi@veritrewonik.ewrew
]
],
iTotalDisplayRecords:2,
iTotalRecords:2,
sColumns:全名,电子邮件,
sEcho:0
}
所有文件正确加载。没有JavaScript错误。
解决方案我已将
sAjaxSource
源更改为相对路径,它的工作。sAjaxSource:../ index.php / getbuildings
。My jQuery DataTable does not list the JSON data. Why is that?
The HTML code:
<!doctype html> <html lang="tr"> <head> <meta charset="utf-8"> <title>Binalar</title> <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"> <style type="text/css" title="currentStyle"> @import "http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/css/demo_page.css"; @import "http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/css/demo_table.css"; </style> <script src="http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/js/jquery.js"></script> <script type="text/javascript" language="javascript" src="http://127.0.0.1/HCAWebApp/DataTables-1.9.4/media/js/jquery.dataTables.js"></script> <script type="text/javascript" charset="utf-8"> $(document).ready(function() { $('#binalar').dataTable({ "bProcessing" : true, "bServerSide" : true, "sAjaxSource" : "http://127.0.0.1/HCAWebApp/index.php/getbuildings" }); }); </script> <style> body { padding: 15px 30px; } .alignleft { float: left; vertical-align:text-bottom; } .alignright { float: right; vertical-align:text-bottom; } td { width: 25% } </style> </head> <body> <div class="navbar"> <div class="navbar-inner"> <div class="container"> <a class="btn btn-navbar" data-toggle="collapse" data-target=".navbar-responsive-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </a> <div class="nav-collapse collapse navbar-responsive-collapse"> <ul class="nav"> <li class='active'><a href="binalar">Binalar</a></li> <li ><a href="cihazlar">Cihazlar</a></li> <li ><a href="kullanicilar">Kullanıcılar</a></li> <li ><a href="gruplar">Gruplar</a></li> </ul> <ul class="nav pull-right"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">İlhan ŞUBAŞI <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Veritronik</a></li> <li><a href="#">Seller</a></li> <li class="divider"></li> <li><a href="kullanicilar/logout">Çıkış</a></li> </ul> </li> </ul> </div><!-- /.nav-collapse --> </div> </div><!-- /navbar-inner --> </div><!-- /navbar --><div class='fdfg'> <div id="baslik"> <h1 style="margin-bottom:-15px" class="alignleft">Binalar</h1> <h3 style="margin-bottom:-15px" class="alignright">+ Bina Ekleme</h3> </div> <div style="clear: both;"></div> <hr> <table cellpadding="0" cellspacing="0" border="0" class="display" id="binalar"> <thead> <tr> <th>Column 1</th> <th>Column 2</th> </tr> </thead> <tbody> <tr> <td colspan="2" class="dataTables_empty">Veriler sunucudan yükleniyor.</td> </tr> </tbody> </table> </div> </body> </html>
The JSON data, it has
application/json
content-type.{ "aaData" : [ [ "Ersin SEewrZA", "eseeza@veritrwqonik.werew" ], [ "İlhan ŞUBewrAŞI", "isuqbasi@veritrewonik.ewrew" ] ], "iTotalDisplayRecords" : 2, "iTotalRecords" : 2, "sColumns" : "FullName,Email", "sEcho" : 0 }
All the files are loading properly. And no JavaScript error.
解决方案I have changed
sAjaxSource
source to a relative path and it worked."sAjaxSource" : "../index.php/getbuildings"
.这篇关于jQuery DataTable不显示数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文