@lorenzofox3 can you give me answer
Hi, I'm new here.. thanks in advance. I have an issue with 'strict select': the select input (filter) is not updated when data changes. More details in this example in http://plnkr.co/edit/vKy1mvwsFLWhfS9wztl1?p=preview
anyone having issues with paginator always applying the active class to the first page link?
Hello everyone, I am new to front end development. I am building the front end for a CMS and using smart table in many of the views. Data is loaded to the smart table by fetching from backend via HTTP request. Backend API supports pagination. I am not sure how do I need to modify the smart table in front end to support the server side pagination. Each page from server contains 100 rows. In front end, I want the number of rows per page to be variable. For example, I can choose to display 10 rows per page in front end. Then the first http request should allow to me to view 10 pages in front end. When I click on 11th page, it should fetch the next set of 100 rows from server. Does smart table support this ? If not, what all do I need to tweak ?
Also, although the sort functionality works well if data is fetched one time, but I want to modify it so that each time sort is clicked, it should send a request to the backend API so that I can load correct set of rows in front end. I tried using
ng-click and calling a function when the table header field is clicked. Using the class of the header field, I can see whether the sort order is ascent or descent. But doing so involves a lot of hacks. If there is a cleaner way built into the smart table library, that would be great
yea looks like it. overriding the stPipe function should do the trick. It contains information in the following format
"sort": {
"predicate": "id",
"reverse": false
},
"search": {},
"pagination": {
"start": 0,
"totalItemCount": 0
}
}Examining this tableState object, I can send the required calls to server and update the data in rowCollection. This is awesome!
Is there any way to trigger
stPipe function using some button ? The function gets triggered on search, sort action. I want to be able to trigger the same function using some buttons. These buttons serve as filter functions. I can write the function and bind it to ng-click of that button but not sure how to trigger the table's stPipe function and how to access the tableState
(And using paging)
<table class="table table-hover" st-table="shoplists" st-safe-src="shoplists_data" >
i use getNotVerifyShops to get some data
then repeat in table
but it not display
this is because callback?
Does it use
$http service, or something else, something non-Angular?
.factory('Shop',['$resource',function($resource){
var obj={};
obj=$resource('http://127.0.0.1:8080/api/shops');
obj.baseinfo=$resource('http://127.0.0.1:8080/api/shops/baseinfo');
obj.getNotVerifyShops=$resource('http://127.0.0.1:8080/api/shops/getNotVerifyShops',{},{isArray:true});
obj.getShopByQuery=$resource('http://127.0.0.1:8080/api/shops/getShopByQuery',{},{ isArray:true});
return obj;}])
it is resource
Have you tried printing some info from the data to your template just to check?
E.g.,
E.g.,
<div>Data count: {{shoplist_data.length}}</div>
I'm sure the data is there.
Data count: 0
oh，no
But I've already printed it out.
console.log(data);
console it in controller
$scope.shoplists = [];
$scope.shoplists_data = [];
function getNotVerifyShops() {
Shop.getNotVerifyShops.query(function(data){
console.log(data);
$scope.shoplists_data = data;
// $scope.shoplists = data;
})
}
getNotVerifyShops() <div>Data count: {{shoplist_data.length}}</div>
<table class="table table-hover" st-table="shoplists" st-safe-src="shoplists_data" >
<thead>
<tr class="sortable">
<th class="table-id" st-sort="shopId" st-sort-default="true">编号</th>
<!-- <th st-sort="area">区域</th> -->
<th st-sort="company">申请公司</th>
<th st-sort="person">联系人</th>
<th st-sort="phone">手机号码</th>
<th st-sort="state">当前状态</th>
<th st-sort="date">最近提交时间</th>
<th st-sort="zaozuo">操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in shoplists_data" class="editable-tr-wrap">
<td class="table-id">{{item.shopId}}</td>
<!-- <td>{{item.area}}</td> -->
<td>{{item.companyName}}</td>
<td>{{item.shopApplyUserId.name}}</td>
<td>{{item.shopApplyUserId.cellphone}}</td>
<td>{{test(item.applyId.verify)}}</td>
<td>{{spliceTime(item.meta.createAt)}}</td>
<!-- <td>{{item.date}}</td> -->
<td><a ui-sref="components.check({obj:item._id})">审核</a></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="8" class="text-center">
<div st-pagination="" st-items-by-page="5" st-displayed-pages="5"></div>
</td>
</tr>
</tfoot>
</table>
Now the data is displayed, but the page, sort is wrong
The most important thing is tab can not be achieved, the previously used analog data is possible
I have dozens of data should be displayed on the three, but now are displayed on one page
I don't think you are a fool, to be honest I think the
st-safe-srcis very badly documented on the Smart-Table site. They do however show that st-table should point to "displayed" data, but I don't think there is any mention of what that means and what "displayed" data should be
Document are based on analog data, I do not quite understand