json-schema-form / angular-schema-form

Generate forms from a JSON schema, with AngularJS!
https://json-schema-form.github.io/angular-schema-form
MIT License
2.47k stars 653 forks source link

checkboxes-inline #342

Open minutephp opened 9 years ago

minutephp commented 9 years ago

Hi,

I was wondering if we can add a "checkboxes-inline" like "radios-inline".

Right now I'm using a custom decorator to do this, but I think it should be part of the core since it is a very common and useful option.

I'm adding code for anyone who would find this useful:

Angular app:

angular.module('ngApp', ['schemaForm']).
    config(['schemaFormDecoratorsProvider', function (decoratorsProvider) {
        decoratorsProvider.addMapping('bootstrapDecorator', 'checkboxes-inline', '/static/js/decorators/checkboxes-inline.html');
    }])

checkboxes-inline.html:

<div sf-array="form" ng-model="$$value$$"
 class="form-group schema-form-checkboxes {{form.htmlClass}}"
 ng-class="{'has-error': hasError(), 'has-success': hasSuccess()}">
<label class="control-label" ng-show="showTitle()">{{form.title}}</label>

<div>
    <label class="checkbox-inline" ng-repeat="val in titleMapValues track by $index">
        <input type="checkbox"
               ng-disabled="form.readonly"
               sf-changed="form"
               class="{{form.fieldHtmlClass}}"
               ng-model="titleMapValues[$index]"
               schema-vaidate="form"
               name="{{form.key.slice(-1)[0]}}">
        <span ng-bind-html="form.titleMap[$index].name"></span>
    </label>
</div>
<div class="help-block" sf-message="form.description"></div>

I hope this is the correct way to do it for now.. and since I haven't had said this before, thanks again for this awesome library by the way :)

Regards, San

davidlgj commented 9 years ago

Sounds like a good idea @minutephp! If you make a PR it's easier to test and comment on, but it looks good to me :+1:

RedDroid commented 7 years ago

Hi @minutephp , Can you create a PR for this? I'm using angular schema form in my project and I need to display checkboxes inline, so this will be helpful. thanks