Dynamic Form and AngularJs - angularjs

Question

We have a dynamic Form being rendered based on database configurations. I am using code as mentioned in the below fiddle
But am not able to get the value of the checkbox element selected. Please guide me through this.
I am using checklist-model for Checkbox Elements.
<label ng-repeat="cCheck in form.color">
<input type="checkbox" checklist-model="outputs[form.databaseAttr]" checklist- value="cCheck" ng-init="outputs[form.databaseAttr] = form.defaultValue"> {{cCheck}} <br>
</label>
Fiddle Link
Please let me know if we have anybetter way of handling Dynamic Forms. Something like jQuery Serialize where we pass the formId and get all elements from the form.

Answer 1

There is a checklist-directive developed to solve the checkbox problem. You can download check-list.js and add it as the module dependency as following:
var exampleApp = angular.module('example', ["checklist-model"]);
So, in your html, you should use checklist-model and checklist-value instead of ng-model and ng-value respectively:
<div ng-switch-when="checkbox">
<br>{{form.text}} <br>
<label ng-repeat="cCheck in form.color">
<input type="checkbox" checklist-model="outputs[form.databaseAttr]" checklist-value="cCheck" ng-init="outputs[form.databaseAttr] = form.defaultValue"> {{cCheck}} <br>
</label>
</div>
Try it yourself.
EDIT: In order to set default values of the checkbox, you can put the values that you want into the outputs[from.databaseAttr] array. In your case, defaultValue:
{
text: 'select mutiple colors',
databaseAttr: 'checkbox',
type: 'checkbox',
color: ['red', 'blue', 'black'],
defaultValue: ['blue'] // <-- blue is set as default
}
JsFiddle.