How to show checkboxes as checked when values are set in the database in angularjs

Question

I have the ionic html code like this

<ion-view view-title="Task">
<ion-content>
  <ion-list>
 <!--<div class="block pad "> <i class="icon glyphicon ion-ios-search-strong "></i><input type="text" id="search" class="search-icon" placeholder="Search" /></div>-->
    <div class="action-checkbox" ng-repeat="task in alltasks">
      <h3>{{task.taskName}}</h3>
      <ul>
        <li ng-repeat="subtask in task.subTasks" ng-click="addList(task,subtask)">
          <input id="{{task._id}}_{{subtask._id}}" name="{{task._id}}_{{subtask._id}}" type="checkbox" value="{{subtask.subTaskName}}" ng-checked="subtask.checked" ng-model="slectedTasks" class="hide"/>
          <label for="{{task._id}}_{{subtask._id}}" > 
            {{subtask.subTaskName}}
          </label>
        </li>
      </ul>
    </div>
  </ion-list>
</ion-content>
</ion-view>
<ion-footer-bar align-title="left" class="bar-assertive pos-fixed">
  <div class="nu" ><a class="button button-stable button-full" ng-click="submit()" >Add to List</a></div>
</ion-footer-bar>

I have controller code like this

.controller('TaskFormCtrl',function($scope,$state,ProjectServices){
    var taskData={};
    $scope.selected = [];
    var selectedMap = [];
    var selectedMap1 = [];
    $scope.postFormData = [];
    var user = "";
    if(localStorage.getItem('employeeInfo')){
        var employeeDetails = JSON.parse(localStorage.getItem('employeeInfo'));
        console.log(employeeDetails.employeeId);
        //$scope.employeeDetails = employeeDetails.employeeId;
        user = employeeDetails.employeeId;
    };
    console.log($scope.test1);
    $scope.alltasks;
    ProjectServices.getAllTasks().then(function(data) {
        $scope.alltasks = data;
        console.log(data);
    });

    $scope.addList = function(task,subtask){
      // console.log(task);
      // console.log(subtask);
       subtask.checked= !(subtask.checked);
       var data = {
       "task_id": task._id,
       "subTaskName": subtask.subTaskName,
       //"subtaskId": subtask._id
    };     
        if(subtask.checked){
          //selectedMap[task._id,subtask.subTaskName] = data;
         selectedMap.push(data);
        } 
    }

    $scope.submit = function(){
    // Do more stuffs here

    taskData.subTasks = selectedMap;
    taskData.userId = user;
    console.log(taskData.userId);
    ProjectServices.saveEmployeeTask(taskData).then(function(data) {
         $state.go('app.calendar');
    });
    }   
})

when I check the values and and submit it will store in the db. Now I need to show the checked values. How to do it. Can anyone please help..

Santhos, do you have Checked property in subtask Object? If you have this, then <input type="checkbox" ng-model="subtask.checked" ng-true-value="'1'" ng-false-value="'0'"> — Mahesh Durairaj
– Mahesh Durairaj, Commented Oct 19, 2015 at 11:16
In the above code, I feel that the problem is that you are not storing the checked property while storing the data. So, the ng-checked property seems not to be doing anything. — Shekhar Chikara
– Shekhar Chikara, Commented Oct 19, 2015 at 11:20
I am able to check the values and after submission I am able to store the data in database. But when user sign out and sign in again , I want to display the checked values — Santhosh Aineri
– Santhosh Aineri, Commented Oct 19, 2015 at 18:09

Kalhan · Accepted Answer · 2015-10-19 11:52:52Z

1

Check this DEMO PLUNKER

No need to use ng-checked, ng-true-value="1" and ng-false-value="0" will do the check and uncheck based on the ng-model value

IF ng-model value is 1 THEN check the checkbox

IF ng-model value is 0 THEN un-check the checkbox

edited Oct 19, 2015 at 11:52

Kalhan

21.9k8 gold badges71 silver badges96 bronze badges

answered Oct 19, 2015 at 11:17

Vinodhan

1104 bronze badges

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

Collectives™ on Stack Overflow

How to show checkboxes as checked when values are set in the database in angularjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related