jeudi 4 avril 2019

Push and slice into array when checkall and checkbox is checked in angularjs

I am trying to push and slice the elements based on checkall, single checkbox clicked, my problem is I am getting a list from angularjs post request and displayed it using ng-repeat I have given provision to enter some text in a new column along with ng-repeat data. Now based on the user selection of checkall or single checkbox clicked I am pushing the data into array. Here I am able to push the data when the user clicked on single checkbox, but when the user clicked on chekall checkbox 0, 1 are pushing the array instead of textbox value. Any help will be greatly appreciated.

Html:
<table class='reportstd' align='center' width='80%' >
        <tr class='trdesign'> 
        <td>
          <input type="checkbox" name = "checkAll"  id="all" data-ng-model="checkedAll" data-ng-change="toggleCheckAll()" /> 
        </td>
        <td> Sl No</td>
        <td> RO No.</td>
        <td> Truck No.</td>
        </tr>


        <tr data-ng-repeat="user in  RosList">
        <td> <input type="checkbox" value="" data-ng-model="user.checked" data-ng-change="modifyArrayToPost(user,truck_no[$index])"  /> </td>
        <td></td>
        <td></td>
        <td><input type='text' data-ng-model="truck_no[$index]" id ="truck_no_" name="truck_no_" value=""></td>
        </tr>
        <table>

        <table>
        <tr>
         <td colspan='2'><input type="submit" id="btn_submit" name='sea' value='Search'   data-ng-submit="postROs(arrayToPost)"  /></td>

        </tr>
        </table>




Angularjs:  
        $scope.arrayToPost = []; 
     $scope.toggleCheckAll = function() {
        if($scope.checkedAll) {
         angular.forEach($scope.RosList, function(user,truckno) {
           user.checked = true;
            $scope.modifyArrayToPost(user,truckno);
         });
       }
       else {
         angular.forEach($scope.RosList, function(user,truckno) {
           user.checked = false;
            $scope.modifyArrayToPost(user,truckno);
         });
       } 
     }

     $scope.modifyArrayToPost = function(user,truckno) {

       if(user.checked && truckno!=null && $scope.arrayToPost.indexOf(user.do_ro_no) == -1){
         $scope.arrayToPost.push(user.do_ro_no, truckno);
       }
       else if(!user.checked) {
         $scope.arrayToPost.splice($scope.arrayToPost.indexOf(user.do_ro_no, truckno), 2);
       }
     } 
     $scope.$watch('RosList', function() {
         var allSet = true;
         var allClear = true;
         angular.forEach($scope.RosList, function(user, truckno) {
            if (user.checked) {
              allClear = false;
            } else {
              allSet = false;
            }         
         });

         var checkAll = $element.find('#all');
         checkAll.prop('indeterminate', false);
         if (allSet) {
            $scope.checkedAll = true;
         } else if (allClear) {
            $scope.checkedAll = false;
         } else {
            $scope.checkedAll = false;
            checkAll.prop('indeterminate', true);
         }
       }, true);





Aucun commentaire:

Enregistrer un commentaire