标签:
‘use strict‘; app.controller(‘DataTableCtrl‘, function ($scope, $compile) { $scope.searchFiles = { name: "", ip: "" }; $scope.show = function () { alert("dd"); } angular.element("#Btnserach").click(function () { table.draw(); }) var table = angular.element("#datetable").DataTable({ sAjaxSource: ‘/Home/Index‘, "sServerMethod": "POST", "bProcessing": true, "bServerSide": true, "bPaginate": true, aoColumns: [ { data: ‘id‘, "mRender": function (data) { return ‘<a ng-click="show()">测试</a>‘; }, "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) { $compile(nTd)($scope); } }, { data: ‘title‘ }, { data: ‘add_time‘ } ], "sDom": "Tflt<‘row DTTTFooter‘<‘col-sm-6‘i><‘col-sm-6‘p>>", "iDisplayLength": 10, "oTableTools": { "aButtons": [ "copy", "csv", "xls", "pdf", "print" ], "sSwfPath": "assets/swf/copy_csv_xls_pdf.swf" }, "language": { "search": "", "sLengthMenu": "_MENU_", "oPaginate": { "sPrevious": "上一页", "sNext": "下一页" } }, "aaSorting": [], "fnServerParams": function (aoData) { aoData.push( { "name": "Name", "value": $scope.searchFiles.name }, { "name": "Ip", "value": $scope.searchFiles.ip } ); } }) });
<div class="widget-body"> <div id="registration-form"> <form role="form"> <div class="form-title"> Contact Us </div> <div class="row"> <div class="col-sm-6"> <div class="form-group"> <label for="exampleInputEmail2">用户名</label> <span class="input-icon icon-right"> <input type="text" class="form-control" id="exampleInputEmail2" placeholder="用户名" ng-model="searchFiles.name"> <i class="fa fa-envelope blue"></i> </span> </div> </div> <div class="col-sm-6"> <div class="form-group"> <label for="exampleInputName2">IP地址</label> <span class="input-icon icon-right"> <input type="text" class="form-control" id="exampleInputName2" placeholder="IP地址" ng-model="searchFiles.ip"> <i class="glyphicon glyphicon-user palegreen"></i> </span> </div> </div> </div> <button id="Btnserach" type="button" class="btn btn-danger">搜索</button> </form> </div> <table id="datetable" class="table table-striped"> <thead> <tr> <th style="width: 30%">First Name</th> <th style="width: 30%">Last Name</th> <th style="width: 40%">Phone #</th> </tr> </thead> <tbody></tbody> </table> </div>
angular JS中使用jquery datatable 自定义搜索按钮点击事件 和mRender的 ng-click事件
标签:
原文地址:http://www.cnblogs.com/lkd3063601/p/5414701.html