1
Datatable будет загружаться, если обновить страницу, но не щелкнуть «список». У меня такое чувство, что он не инициализирован правильно, но не уверен. Я не уверен, как применить директиву для загрузки DataTable данные по нажатию «список»Datatable not loading в AngularJS view
Переписанный код:
<body ng-app="RT.Routing">
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-default sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
<li class="add_publisher">
<a href="#/list"><i class="fa fa-list"></i> Publishers</span></a>
</li>
<li class="publisher">
<a href="#/test"><i class="fa fa-list"></i> Link 2</a>
</li>
</ul>
</div>
<!-- /.sidebar-collapse -->
</div>
<!-- /.navbar-static-side -->
</nav>
<div ng-view></div>
</div>
<script type="text/ng-template" id="embedded.list.html">
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-body">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover" id="publishers">
<thead>
<tr>
<th>ID</th>
<th>Publisher</th>
<th>Integration</th>
<th>Contact</th>
<th>Status</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
</div>
</div>
</script>
<script type="text/ng-template" id="embedded.test.html">
<div id="page-wrapper">
<div class="container">
<h2>Header</h2>
<h4>Other Content</h4>
</div>
</div>
</script>
<script type="text/javascript">
var routingExample = angular.module('RT.Routing', []);
routingExample.controller('testController', function ($scope) {});
routingExample.controller('ListController', function ($scope) {});
routingExample.config(function ($routeProvider) {
$routeProvider.
when('/test', {
templateUrl: 'embedded.test.html',
controller: 'testController'
}).
when('/list', {
templateUrl: 'embedded.list.html',
controller: 'ListController'
}).
otherwise({
redirectTo: '/list'
});
});
</script>
</body>
НИЖЕ JS называют в заголовке HTML-файла ВЫШЕ
(function($){
$(document).ready(function() {
var editor = new $.fn.dataTable.Editor({
"ajax": "php/table.publishers.php",
"table": "#publishers",
"fields": [
{
"label": "Publisher",
"name": "publisher",
"type": "text"
},
{
"label": "Integration",
"name": "integration",
"type": "select",
"ipOpts": [
{
"label": "Turn Key ",
"value": "Turn Key "
},
{
"label": " Custom",
"value": " Custom"
}
]
},
{
"label": "Contact",
"name": "contact",
"type": "text"
},
{
"label": "Status",
"name": "status",
"type": "select",
"ipOpts": [
{
"label": "Active ",
"value": "Active "
},
{
"label": " Disabled",
"value": " Disabled"
}
]
}
]
});
$('#publishers').dataTable({
"dom": "Tfrtip",
"ajax": "php/table.publishers.php",
"columns": [
{
"data": "id"
},
{
"data": "publisher"
},
{
"data": "integration"
},
{
"data": "contact"
},
{
"data": "status"
}
],
"tableTools": {
"sRowSelect": "os",
"aButtons": [
{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
}
});
});
}(jQuery));