Good Afternoon,
I have a couple of problems that I have spent a few days trying to figure out, the first is my ngModel is not binding correctly as some of the checkboxes should be checked on load, you can see there state next to each one. The second problem which could be related to the first problem is that when I check one of the boxes, it unchecks itself after a second. I can see the ng-change is firing but it is always 'True'.
I have tried ngChecked, which I did get working but I know from reading the docs this is not meant to be used with ngModel.
Time for the code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<form name="myForm">
<div ng-if="data.show_desc == 'true'"></div>
<ul ng-repeat="item in data.checklist_items">
<li>
<label for="lists_1">
<input type="checkbox"
id="lists_1"
ng-model="all"
ng-change="c.selectAll(all)"
/>
<span ng-if="data.bold == 'true'"><strong></strong>- </span>
<span ng-if="data.bold == 'false'"></span>
</label>
<ul ng-repeat="sub_item in data.sub_checklist_items | filter:item.name">
<li>
<label for="sub_items_2">
<input type="checkbox"
id="sub_items_2"
ng-model="sub_item.completed"
ng-change="c.selectRecord(sub_item)"
/>
</label> -
</li>
</ul>
</li>
</ul>
</form>
</html>
Top Level List:
[
{
"name":"Checklist Item 1",
"completed":"false",
"sys_id":"52269f70473e1110ca70bce5536d43db"
},
{
"name":"Checklist Item 2",
"completed":"false",
"sys_id":"9e269f70473e1110ca70bce5536d43db"
},
{
"name":"Checklist Item 3",
"completed":"false",
"sys_id":"da269f70473e1110ca70bce5536d43db"
},
{
"name":"Checklist Item 4",
"completed":"false",
"sys_id":"1a269f70473e1110ca70bce5536d43db"
}
]
Sub Level list:
[
{
"name":"Sub Checklist 4",
"completed":"true",
"sys_id":"1a269f70473e1110ca70bce5536d43dc",
"parent_checklist":"Checklist Item 4"
},
{
"name":"Sub Checklist 1",
"completed":"true",
"sys_id":"92269f70473e1110ca70bce5536d43dc",
"parent_checklist":"Checklist Item 1"
},
{
"name":"Sub Checklist 1",
"completed":"true",
"sys_id":"da269f70473e1110ca70bce5536d43dc",
"parent_checklist":"Checklist Item 2"
},
{
"name":"Sub Checklist 2",
"completed":"true",
"sys_id":"56269f70473e1110ca70bce5536d43dc",
"parent_checklist":"Checklist Item 1"
},
{
"name":"Sub Checklist 2",
"completed":"true",
"sys_id":"9e269f70473e1110ca70bce5536d43dc",
"parent_checklist":"Checklist Item 2"
}
]
Any ideas?
So far I have tried ngChecked and AngularJS directive for list of checkboxes. My end goal is to track the state of each checkbox and maybe when the top level is checked then all the sub checklists are also checked, I really didn't think it was going to be this hard...sigh
Aucun commentaire:
Enregistrer un commentaire