tanyaa tanyaa - 3 months ago 12
MySQL Question

how to filter dates with angular?

I'm building a project with angular and php. I have a "select" option where I choose specific date and it shows me all details in a table, and counting on several things and everything works great. but when I pick a date, i want it to show all results by specific month and not by specific date(for example --> now i choose date like this - '2016-4-15' it will give me all information specific to this date and not by month like i need). can someone please help? in my database the 'date' value is date.

Php query :

$query=" SELECT `description` ,`total_price` , `name`,`supplier_id`,`date` FROM `suppliers`,`expenses`
where `supplier_id` = `refer_supplier_id` ";


Html:

<select ng-model="supplierExpenses.selectedOption" ng-change="setTotals(supplierExpenses)"
ng-options = "item.date for item in supplierExpenses |
unique:'date'" >

<option value="">בחר תאריך</option>
</select>



<div class="table-responsive">
<table class="customer-list table table-striped" >
<thead>
<tr >

<th class="Column-Header">מספר ספק</th>
<th class="Column-Header">שם ספק</th>
<th class="Column-Header">כמות מוצרים שנקנו</th>
<th class="Column-Header">מחיר הוצאה</th>

</tr>
</thead>
<tbody>
<tr ng-repeat="item in supplierExpenses" ng-if = "item.date == supplierExpenses.selectedOption.date"
>

<td>{{item.supplier_id}}</td>
<td>{{item.name}}</td>
<td>{{item.description}}</td>
<td>{{item.total_price}}</td>

</tr>
</tbody>
<tfoot>

<tr class="bg-warning">
<td><font size="6">סה"כ הוצאות</font></td>
<td><font size="6">{{totalExpenses}}</font></td>
<td></td>
</tr>
</tfoot>

</table>


</div>


Controller:

"use strict";
angular.module('dataSystem').controller('supplierExpensesCtrl', function ($scope, $route, $location, $http) {
$http({method:'GET', url:'api/reports-tab/supplier-expenses-by-mounth.php/'})
.then(function(response) {
var arr = JSON.parse(JSON.parse(response.data));
$scope.supplierExpenses = arr;
})

// This will log you the error code and trace, if there is an error.
.catch(function(err) {
console.log('err', err)
});

$scope.totalExpenses = 0;
$scope.setTotals = function(totalItem){
$scope.totalExpenses = 0;
for(var item =0; item< totalItem.length; item++){
// console.log(totalItem[item]);
if (totalItem[item] && (totalItem[item].date == $scope.supplierExpenses.selectedOption.date)){

$scope.totalExpenses += parseInt(totalItem[item].total_price);
}
}
}
});

Answer

Hi glad you succeed with the total ^^ I edit my answer with the working solution for the date issue

$http({method:'GET', url:'api/reports-tab/supplier-expenses-by-mounth.php/'})
      .then(function(response) { 
          var arr = JSON.parse(JSON.parse(response.data)), month, date; 
          for(var i = 0; i< arr.length; i++){ 
              date = new Date(arr[i].date); //we convert the string into javascript date
              month = date.getMonth()+1; 
              if(month.length === 1){ 
                  month = '0'+month; //we add a 0 if needed
              } 
              var year = date.getFullYear(); 
              arr[i].date = month+'/'+year; //we use only the month and year
          } 
          $scope.supplierExpenses = arr; 

      })