How to filter table data in ng-repeat with date

1k views Asked by At

I have the following

index.cshtml

<td>From:<input kendo-date-picker ng-model="date1" class="form-control input-sm" /></td>
<td>To:<input kendo-date-picker ng-model="date2" class="form-control input-sm" /></td>

         <tr dir-paginate="item in AllItems| itemsPerPage: 15 | filter : dateRangeFilter:date1:date2"> @*filter : SearchSubmitDate | filter : MarketingSearch filter: dateRangeFilter('SubmitDate', startDate, endDate)*@
            <td style="font-weight:bold;">{{item.MarketingFormattedID}}</td>
            <td  filter="{ 'SubmitDate': 'text' }">{{item.SubmitDate| mydate | date: 'MM/dd/yyyy'}}</td>
            <td>{{item.DueDate| mydate | date: 'MM/dd/yyyy'}}</td>
            <td>{{item.Description}}</td>
            <td>{{item.SubmittedBy}}</td>
            <td>{{item.MarketingStatusTypeName}}</td>
            <td>{{item.AssignedTo}}</td>
            <td><button ng-click="GetByMktId(item.MarketingID)"> Edit</button></td>
        </tr>

in .js file

function parseDate(input) {
    return Date.parse(input);
}

app.filter("dateRangeFilter", function () {
return function (items, from, to) {
    console.log('dateRangeFilter ' + from + ' ' + to);
    var df = parseDate(from);
    var dt = parseDate(to);
    console.log('parsed ' + df + ' ' + dt);
    var result = [];
    for (var i = 0; i < items.length; i++) {
        var date_bet = items[i].datetime;
        if (date_bet > df && dt > date_bet) {
            result.push(items[i]);
        }
    }
    return result;
    };
});

Everything comes as undefined. I am relatively new to angularjs and tried all the different ways i could find on stackoverflow or google. not sure what i am missing. please help. thanks.

Additional Info: It is a very big controller so i didn't include all the info.

app.controller('cvManageMarketingController', function ($scope, serviceMarketing, updateMarketingItemService, marketingItemsListService,
            serviceNewMarketCode, serviceSaveMktFiles, serviceGetMktFiles, serviceDownloadMktFile, $filter){

    marketingItemsListService.getAll().then(function (value) {
        $scope.AllItems = (value);
        $scope.orderByField = 'SubmitDate';
        $scope.reverseSort = true;
        $scope.AllFiles = [];
        $scope.MarketingID = 0;
        $scope.MarketingFormattedID = "";
        $scope.Headers = "Add Marketing Item";
    });
}

and i pass ng-controller="cvManageMarketingController" to the main div.

1

There are 1 answers

0
Naveen Kumar G C On

I would like to suggest you to use smart table plugin for populating the items in angular js which comes with handy api's and all needed things like pagination , items to display etc..