Search code examples
javascriptangularjsangular-schema-form

Not able to render checkbox using angular schema form directive


I am using angular schema form directive to render the form. I am able to render all the elements except checkbox. When I use checkbox I get following error:

TypeError: Cannot read property 'default' of undefined

JS:

var ngSchemaForm = {};
     ngSchemaForm.schema={
         type: "object",
            properties: {
              cbProp: {
                    cb: { title: "I am checkbox", type: "boolean", default: false }
                },
            }
        }

        ngSchemaForm.cbSection={
         type: "conditional",
            condition: "model.currentSection=='cbSection'",
            items: [
                {
                    type: "section",
                    htmlClass: "row",
                    items: [
                        {
                            type: "section",
                            htmlClass: "col-lg-12",
                            items: [{ key: "cbProp.cb", type: "checkbox" }]
                        }
                    ]
                }
          ]
        }

        ngSchemaForm.form={
         "type": "section",
          "htmlClass": "container",
          "items": [ ngSchemaForm.cbSection ]
        }

        var formApp = angular.module('formApp', ['schemaForm']);

        formApp.controller('FormController', function ($scope) {
            $scope.schema = ngSchemaForm.schema;
            $scope.form = ngSchemaForm.form;
            $scope.model = { currentSection: "cbSection" };
        });

HTML:

<div id="formApp" ng-app="formApp" ng-controller="FormController">
    <p></p>
    <ng-form name="formApp" >
             <div sf-schema="schema"
                  sf-form="form"
                  sf-model="model">

            </div>
    </ng-form> 
</div>

Solution

  • changed:

    items: [{ key: "cbProp.cb", type: "checkbox" }]
    

    To:

    items: [{ key: "cbProp.cb" }]
    

    and worked