Angular.forEach converting values to use in sort table

Question

I'm trying to sort through my list in Angular, but it's not working.

The default sort order should be by Fiscal Year descending, but some 2019 values are being sorted after 2020 values:

https://i.sstatic.net/niFu2.png

Then numbers are being sorted incorrectly when you click on that column sort:

https://i.sstatic.net/q7VRb.png

And the end date has no sorting structure. I am setting it to MM/dd/yyyy format in the view, not sure if that has any bearing:

https://i.sstatic.net/4eRXh.png

Only tried reverse and descending orders. Not sure if there are any syntax or built-in ways of sorting.

Controller:

function init() {
        $scope.loading = true;
        $scope.rfrorder = {
            Orderby: 'rfrFY',
            descending: false
        };
        ContractsService.getRefRFRInformation()
            .then(function (results) {
                $scope.refRFRInfo = results.data;
                angular.forEach($scope.refRFRInfo, function (value) {
                    value.edit = true;
                    value.editMode = false;
                    if (value.endDate == null) {
                        value.edit = false;
                    }
                }); 
                $scope.loading = false;
            });

    }

 $scope.rfrSorting = function (column) {
        var sort = $scope.rfrorder;
        if (sort.Orderby == column) {
            sort.descending = !$scope.rfrorder.descending;
        } else {
            sort.Orderby = column;
            sort.descending = false;
        }
    };
    $scope.rfrselected = function (column) {
        if (column == $scope.rfrorder.Orderby) {
            return ('tablesort-icon glyphicon glyphicon-arrow-' + (($scope.rfrorder.descending) ? 'down' : 'up'));
        }
        else {
            return 'tablesort-icon glyphicon glyphicon-sort';
        }
    };

View:

<thead class="headercolor">
   <tr class="thead">
       <th ng-click="rfrSorting('rfrFY')"><div class="tablesort-header">RFR FY <i ng-class="rfrselected('rfrFY')"></i></div></th>
       <th ng-click="rfrSorting('rfrNumber')"><div class="tablesort-header">RFR Number <i ng-class="rfrselected('rfrNumber')"></i></div></th>
       <th ng-click="rfrSorting('rfrEffectiveDate')"><div class="tablesort-header">Effective Date <i ng-class="rfrselected('rfrEffectiveDate')"></i></div></th>
       <th ng-click="rfrSorting('rfrEndDate')"><div class="tablesort-header">End Date <i ng-class="rfrselected('rfrEndDate')"></i></div></th>
       <th ng-click="rfrSorting('rfrModifiedDate')"><div class="tablesort-header">Modified Date <i ng-class="rfrselected('rfrModifiedDate')"></i></div></th>
       <th ng-click="rfrSorting('rfrModifiedBy')"><div class="tablesort-header">Modified By <i ng-class="rfrselected('rfrModifiedBy')"></i></div></th>
       <th></th>
    </tr>
</thead>

<tbody class="form-group form-group-sm">
<tr ng-repeat-start="rfrDetail in refRFRInfo | orderBy:rfrorder.Orderby:rfrorder.descending">

EDIT

I believe it has to do with the numbers coming back as string. I'm trying to find a way that will go through and convert the numbers, then put them back in an object I can display on my view.

ContractsService.getRefRFRInformation()
            .then(function (results) {
                $scope.refRFRInfo = results.data;

                angular.forEach($scope.refRFRInfo, function (value) {
                    //$scope.model.refRFRInfo.rfrNumber = parseInt(value.rfrNumber);
                    //$scope.model.refRFRInfo.rfrFY = parseInt(value.rfrFY);
                    //$scope.model.refRFRInfo.endDate = Date.parse(value.endDate);
                    $scope.number.push(value.rfrNumber);
                    value.edit = true;
                    value.editMode = false;
                    //new Date(value.startDate).withoutTime() <= new Date().withoutTime() &&
                    if (value.endDate == null) {
                        // value.editMode = true;
                        value.edit = false;
                    }
                });
                $scope.loading = false;
            });

I understand the basic principle as I have $scope.number for a validation, but I don't know how to iterate through the entire object and then create a new object with the proper values.

mallenswe · Accepted Answer · 2019-05-06 21:30:05Z

0

The problem is with your sorting code.

Try looking at this post: AngularJS sorting rows by table header

answered May 6, 2019 at 21:30

mallenswe

426 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

aplane1290 Over a year ago

Thanks, copied the method exactly and it still did the same thing. My sort functionality works on another page already as I have it, so it's gotta be something to do with my data.

mallenswe Over a year ago

If the sorting works an another page what are the differences between the pages? Beside the data did you add anything else to the page to present the data differently? Are you able to post a JSBin or Plunker?

aplane1290 Over a year ago

There is a lot of inheritance and stored procedures used from a database. The weird thing is that the code is working on the other page, and the code works for THIS page for "rfrModifiedDate" ONLY. The rfrNumber also works, but only on the first number (i.e. 1234, 12345, 2, 3, etc.) I tried using a parseInt, but wasn't sure how to get it to the view iteration. But "rfrFY" is already an int and that doesn't sort correctly (i.e. 2019, 2019, 2020, 2019, 2022, 2020). :(

Collectives™ on Stack Overflow

Angular.forEach converting values to use in sort table

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related