zizzamia / ng-tasty Goto Github PK

Add ng-tasty on npm and update angular-mocks on npm.

Looks that the filter orderBy when contain as key a - is not sorting correctly.

Also params need return an object with all the info about the pagination and sorting.

Add ngTasty.util as shortcut for all the service in ngTasty

Be possible add debounce behavior to the xhr callback in the server side table directive.

In the table directive when you set not-sort-by empty should not allow all the columns to be sorted.

In the table directive it's important be able to support an empty resource object, and maybe return some nice message about it.

This line https://github.com/Zizzamia/ng-tasty/blob/master/src/table/table.js#L49
cause an error during pagination.
If the rows are just one the pagination is not showed.

hi Zizzamia,

In my project, I'm facing an error "the resource (ctrl.perfRes) has the property header or rows undefined ", the following is the primary code(not use $scope):
controller.js

function portalCtrl(){

var ctrl = this,
resData = [{name: 'David', street: '1234 Anywhere St.'}]
 ctrl.perfRes = {
            "header": [
              {"bizModule": "Biz Module"},
              {"high": "High"},
              {"normal": "Normal"},
              {"low": "Low"}
            ],
            "rows": resData,
            "sortBy": "bizModule",
            "sortOrder": "asc"
}
}

<div ng-controller="portalCtr as ctrl">
            <div tasty-table resource="ctrl.perfRes" class="table-responsive">
              <table class="table">
                <tbody>
                  <tr ng-repeat="row in rows">
                    <td>{{row.bizModule}}</td>
                    <td>{{row.high}}</td>
                    <td>{{row.normal}}</td>
                    <td>{{row.low}}</td>
                  </tr>                  
                </tbody>
              </table>
              <div tasty-pagination></div>
            </div> 
</div>

 AngularJS tastyTable directive: the resource (ctrl.perfRes) has the property header or rows undefined <div class="app-content-body fade-in-up ng-scope" ui-view="">

please help to check , thanks.

Give the opportunity to use ngTasty.table without an async request.

We need a basic async edit field component compatible with bootstrap style.

Disable a specific key for sorting.

At this moment I am unable to set default �orderBy and sortOrder for server side table version. Regardless what function returns
return {
'rows': response.data.rows,
'header': response.data.header,
'pagination': response.data.pagination,
'sortBy': "mesto",
'sortOrder': "asc"
};
Table seems to ignore that.

We need replace all the

<div class="col-md-3 text-left">

width

<div class="col-x3 text-left">

In the client table document better:

• sortBy
  -items-per-page and list-items-per-page in pagination

Also some part of the documentation is not working.

Just wondering if this would make things easier to read or write

$scope.resource = {
  "header": [
    {"name": "Name"},
    {"star": "Star"},
    {"sf-location": "SF Location"}
  ],
  "rows": [
    { "name": "Ritual Coffee Roasters", "star": "★★★★★", "sf-location": "Hayes Valley"},
    ...
    { "name": "Flywheel Coffee Roasters", "star": "★★★★★", "sf-location": "Upper Haight" }
  ]
};

You can recycle same current logic through something like:

if (Object.keys(obj.header[0]).length === 1) {
  obj.header = obj.header.map(function (header) {
    var key = Object.keys(header)[0];
    return {
        key: key,
        name: header[key]
    };
  });
}

Assuming if one header uses just one key it's based on the new pattern.

Write documentation for filterInt

Add the possibility to customize the count list in table pagination.

As you can see the pagination use <span> instead <a>, I think it's important fix this bug and make consistent con bootstrap http://getbootstrap.com/components/#pagination.

Start collecting benchmarks by using https://github.com/angular/angular.js/tree/master/benchmarks

Doing a complete refactoring of all the Grunt code in Gulp.

Like bootstrap angularjs, create a button to download the last version of ngTasty.

Write documentation for the debounce service.

Complete the table directive with test about the url params creation.

Add

• changelog
• current version next to the title
• Fix the left nav colors and width
• Start adding the documentation for the normal table vs the ajax table

Create a separate table is only ajax

Tried about a week ago to run up the demo app following instructions, but it didn't work. So I finally just cleared it all out and looped back around to document the process so we can see where the trouble might be. Here goes:

• checked out a clean copy of the repo
• cd'd into project folder, where package.json and gulpfile.js reside
• ran npm install, looks like everything installed fine. No errors, two warnings:

npm WARN deprecated [email protected]: use gulp-rimraf instead
npm WARN excluding symbolic link build/defs-config.json -> ../defs-config.json

ran bower install -- no errors, no warnings
ran npm start, looks like some problems here. full output:

Wesleys-MacBook-Pro:ng-tasty wesww$ npm start

> [email protected] start /Users/wesww/Sites/ng-tasty
> node docs/server.js port=3000

Warning: config file not found.

taking a look at the app now, we're not doing great

console ctrl-c:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:3000/dist/ng-tasty-tpls.js
Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module ngTasty due to:
Error: [$injector:nomod] Module 'ngTasty' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.2/$injector/nomod?p0=ngTasty
    at http://localhost:3000/components/angular/angular.js:80:12
    at http://localhost:3000/components/angular/angular.js:1764:17
    at ensure (http://localhost:3000/components/angular/angular.js:1688:38)
    at module (http://localhost:3000/components/angular/angular.js:1762:14)
    at http://localhost:3000/components/angular/angular.js:4030:22
    at forEach (http://localhost:3000/components/angular/angular.js:339:20)
    at loadModules (http://localhost:3000/components/angular/angular.js:4014:5)
    at http://localhost:3000/components/angular/angular.js:4031:40
    at forEach (http://localhost:3000/components/angular/angular.js:339:20)
    at loadModules (http://localhost:3000/components/angular/angular.js:4014:5)
http://errors.angularjs.org/1.3.2/$injector/modulerr?p0=ngTasty&p1=Error%3A…tp%3A%2F%2Flocalhost%3A3000%2Fcomponents%2Fangular%2Fangular.js%3A4014%3A5)
    at http://localhost:3000/components/angular/angular.js:80:12
    at http://localhost:3000/components/angular/angular.js:4053:15
    at forEach (http://localhost:3000/components/angular/angular.js:339:20)
    at loadModules (http://localhost:3000/components/angular/angular.js:4014:5)
    at http://localhost:3000/components/angular/angular.js:4031:40
    at forEach (http://localhost:3000/components/angular/angular.js:339:20)
    at loadModules (http://localhost:3000/components/angular/angular.js:4014:5)
    at createInjector (http://localhost:3000/components/angular/angular.js:3940:11)
    at doBootstrap (http://localhost:3000/components/angular/angular.js:1451:20)
    at bootstrap (http://localhost:3000/components/angular/angular.js:1472:12)
http://errors.angularjs.org/1.3.2/$injector/modulerr?p0=myApp&p1=Error%3A%2…p%3A%2F%2Flocalhost%3A3000%2Fcomponents%2Fangular%2Fangular.js%3A1472%3A12) 

looks like the problem is that the demo app is looking for GET http://localhost:3000/dist/ng-tasty-tpls.js
but no dice:

If the header during server side table it's empty should return a nice error message.

TypeError: Cannot read property '0' of undefined
  at g.$scope.setDirectivesValues (/Users/zizzamia/Desktop/ngTasty/src/table/table.js:100:39)

We need strip only undefined, and keep null and False.
https://github.com/Zizzamia/ng-tasty/blob/master/src/table/table.js#L95

Because table directive has scope: true we don't get isolate scope, and we fire the external variable only once.
If you refresh the resource espression we will not notice that.
Possible fix will be to use an isolate scope scope: { ... }

By using Batarang we need profile every binding is not fast enough and improve it.

A simple way to doing alert with keeping the bootstrap style.

Make more responsive for small display the documenation.

It would be nice to be able to select the pagination format.

Refer to this page: http://angular-ui.github.io/bootstrap/#/pagination

The query params need be possible to config.

When I change between 25 and 5 entries, the table is no longer visible. It would be nice if whenever I change the number of entries the page would scroll up to the top of the table.

Looks is not working properly, possible fix

for (var i = scope.listItemsPerPage.length; i >= 0; i--) {
  if (scope.pagination.size > scope.listItemsPerPage[i]) {
    scope.listItemsPerPageShow = scope.listItemsPerPage.slice(0, (i + 1));
    break;
  }
}

Check angular bootstrap for an inspiration how improve the dist folder.

There are two Coffee Bar entries from the Financial District.

The "star" column is capitalized for the pagination table but not for the sorting and complete tables.

Finally, one of the Blue Bottles is not capitalized.

When I click in pagination links Angular routes mi to '/' path of my application. This is due to href="#" attribute in links.

Why this problem does not occur on ngTasty homepage example of grid?

This code will fix an issue related to the filters in table

    if ($attrs.filters) {
      urlQuery = tastyUtil.joinObjects(urlQuery, filters);
      urlQuery['sortBy'] = undefined;
      urlQuery['sortOrder'] = undefined;
      urlQuery['page'] = undefined;
      urlQuery['count'] = undefined;
    }
    if ($scope.theadDirective) {
      urlQuery = tastyUtil.setProperty(urlQuery, params, 'sortBy');
      urlQuery = tastyUtil.setProperty(urlQuery, params, 'sortOrder');
    }
    if ($scope.paginationDirective) {
      urlQuery = tastyUtil.setProperty(urlQuery, params, 'page');
      urlQuery = tastyUtil.setProperty(urlQuery, params, 'count');
    }

Be able to passing different percentage witdh in tasty-thead

@Zizzamia Getting a weird error, can't figure out what's going on. I scaled down my data to some mock stuff and it's still giving me this. Are any parameters required by the configuration?

Happens in [email protected] and v1.3.0-rc.3

 <div tasty-table resource-callback="getResource" filters="filterBy">

            <table class="table table-striped table-condensed">

                <thead tasty-thead></thead>
                <tbody>
                    <tr ng-repeat="row in rows">
                        <td>{{ row.id }}</td>
                    </tr>
                </tbody>
            </table>

            <div tasty-pagination></div>
        </div>

        $scope.getResource = function ( params )
        {
            // ng-tasty requires $http for the .then() promise
            return $http.get( UrlHelper.user.getAll(),
                {
                    headers: { "Authorization": Session.get.authToken()
                }
            } )
                .success( function ( data )
                {

                    $scope.pagination = {
                        "count": 10,
                        "page": data.page,
                        "pages": 7,
                        "size": data.count
                    };

                    return {
                        "rows": [
                            {
                                "active": true,
                                "email": "[email protected]",
                                "first_name": null,
                                "id": 13,
                                "is_admin": false,
                                "last_name": null,
                                "photo_url": null
                            }
                        ],
                        "header": [{ "key": "id", "name": "ID"}],
                        "pagination": $scope.pagination
                    }

                });
        };

Improve html and css code to show in the example part.
Show the request from front-end and response how should be from back-end.

Below there is the improvement need it for fix the null issue.

if (typeof objTwo[attrname] !== 'undefined' && objTwo[attrname] !== null) {
  objOne[attrname] = objTwo[attrname];
}

In the client side version of the table directive, the filter functionality need be implemented.

Add the npm budge on the README and explain how also install ngTasty by the npm on the documentation.