Permalink
Browse files

fix(attributes): custom attribute to set attributes on aurelia-form e…

…lements

- custom attribute "attributes"
- bootstrap elements updated
- global resources (fix)
  • Loading branch information...
bas080
bas080 committed Jun 8, 2016
1 parent dd7149c commit ef9b8d1b93e75b9a6bab051a80027d5e7aec6779
@@ -0,0 +1,18 @@
import {inject} from 'aurelia-dependency-injection';

/***
* is only used internally. In future might make this a seperate plugin
*/

@inject(Element)
export class AttributesCustomAttribute {

constructor(element) {
this.element = element;
}

valueChanged() {
$(this.element).attr(this.value || {});
}

}
@@ -1,19 +1,21 @@
import {Config} from './config';
import {entitySchema} from './entity-schema';
import {Form} from './form';

function configure(aurelia, configCallback) {
let config = aurelia.container.get(Config);

configCallback(config);

aurelia.globalResources(
'./schema-form',
'./form-fields',
'./form-field'
'./elements/schema-form',
'./elements/form-fields',
'./elements/form-field'
);
}

export {
Form,
configure,
entitySchema
};
@@ -19,14 +19,6 @@ export class FormFieldCustomElement {
this.viewManager = viewManager;
}

attached() {
// consider: using aurelia DOM pal
let attributeElements = $(this.element).find('[attrs]');
if (attributeElements) {
attributeElements.attr(this.attribute.attributes || {});
}
}

/**
* Used to determine the what to display
*
@@ -1,4 +1,3 @@
//import {bindable, bindingMode} from 'aurelia-framework';
export class Actions {

activate(model) {
@@ -1,10 +1,3 @@
import {Actions} from '../actions';

export class ActionsCustomElement extends Actions {

activate(model) {
this.attribute = model.attribute;
this.model = model.value;
}

}
export class ActionsCustomElement extends Actions {}
@@ -1,14 +1,16 @@
<template>
<require from="./form-group.html"></require>

<require from="./../../attributes"></require>
<form-group attribute.bind="attribute">
<div class="checkbox">
<label>
<input
attrs
type="checkbox"
name.bind="attribute.key"
checked.bind="attribute.value">
attributes.bind="attribute.attributes"
type="checkbox"
t.bind="label"
name.bind="attribute.key"
checked.bind="attribute.value">
${label}
</label>
</div>
</form-group>
@@ -1,15 +1,16 @@
<template>
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<require from="./../../attributes"></require>
<form-group attribute.bind="attribute" attributes.bind="attribute.attributes">
<div class="checkbox" repeat.for="option of attribute.options">
<label>
<input
attrs
type="checkbox"
name.bind="option.name"
model.bind="option.value"
checked.bind="value">
${option.name}
attributes.bind="option.attributes"
type="checkbox"
name.bind="option.name"
model.bind="option.value"
checked.bind="value">
${option.name}
</label>
</div>
</form-group>
@@ -1,7 +1,9 @@
<template>
<require from="./../..//attributes"></require>
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<form-fields
attributes.bind="attribute.attributes"
repeat.for="model of models"
model.bind="model"
schema.bind="attribute.schema">
@@ -1,7 +1,3 @@
import {Collection} from './../collection';

export class CollectionCustomElement extends Collection {
constructor() {
super();
}
}
export class CollectionCustomElement extends Collection {}
@@ -1,10 +1,9 @@
<template>

<fieldset attrs>
<require from="./../../attributes"></require>
<fieldset attributes.bind="attribute.attributes">
<form-fields
model.bind="value"
schema.bind="attribute.schema">
</form-fields>
</fieldset>

</template>
@@ -2,7 +2,7 @@
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<input
attrs
attributes.bind="attribute.attributes"
type="file"
name.bind="attribute.key"
value.bind="attribute.value">
@@ -1,6 +1,13 @@
<template bindable="attribute">
<div class="form-group">
<label t.bind="attribute.key || attribute.label" if.bind="attribute.label !== false">${attribute.key || attribute.label}</label>
<template bindable="attribute, message">
<require from="./../../attributes"></require>
<div
attributes.bind="attribute.attributes"
class="form-group">
<label
class="controle-label"
t.bind="attribute.key || attribute.label"
if.bind="attribute.label !== false">${attribute.key || attribute.label}</label>
<content></content>
<span class="help-block">${message}</span>
</div>
</template>
@@ -0,0 +1,12 @@
import {FormGroup} from '../form-group';

export class FormGroupCustomElement extends FormGroup {

/**
* @returns {string} represents the error type for the bootstrap framework
*/
messageChanged() {
$(this.element).toggleClass('has-error', !!this.message);
}

}
@@ -1,16 +1,12 @@
<template>

<require from="./form-group.html"></require>

<form-group attribute.bind="attribute">

<require from="./../../attributes"></require>
<require from="./form-group"></require>
<form-group attribute.bind="attribute" message.bind="message">
<input
attrs
attributes.bind="attribute.attributes"
class="form-control"
type.bind="attribute.type"
name.bind="attribute.key"
value.bind="value">

</form-group>

</template>
@@ -1,15 +1,16 @@
<template>
<require from="./../../attributes"></require>
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<div class="radio" repeat.for="option of attribute.options">
<label>
<input
attrs
type="radio"
name.bind="option.name"
model.bind="option.value"
checked.bind="value">
${option.name}
attributes.bind="attribute.attributes"
type="radio"
name.bind="option.name"
model.bind="option.value"
checked.bind="value">
${option.name}
</label>
</div>
</form-group>
@@ -1,9 +1,17 @@
<template>
<require from="./../../attributes"></require>
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<select attrs value.bind="value" class="form-control">
<option selected disabled value="-1"></option>
<select
attributes.bind="attribute.attributes"
value.bind="value"
class="form-control">
<option
selected
disabled
value="-1"></option>
<option repeat.for="option of attribute.options"
attributes.bind="option.attributes"
name.bind="attribute.key"
model.bind="option.value">${option.name}</option>
</select>
@@ -1,8 +1,11 @@
<template>
<input
attrs
class="pull-right btn btn-primary"
type.bind="attribute.type"
name.bind="attribute.key"
value.bind="attribute.key">
<require from="./form-group.html"></require>
<form-group attribute.bind="attribute">
<input
attributes.bind="attribute.attributes"
class="pull-right btn btn-primary"
type.bind="attribute.type"
name.bind="attribute.key"
value.bind="attribute.key">
</form-group>
</template>
@@ -1,13 +1,11 @@
<template>

<require from="./form-group.html"></require>

<form-group attribute.bind="attribute">
<require from="./../../attributes"></require>
<form-group>
<textarea
attrs
attributes.bind="attribute"
class="form-control"
name.bind="attribute.key"
value.bind="value"></textarea>
</form-group>

</template>
@@ -2,7 +2,7 @@ export class Collection {

activate(model) {
this.attribute = model.attribute;
this.models = model.value;
this.models = model.value;
}

}
@@ -0,0 +1,17 @@
import {bindable, inject} from 'aurelia-framework';


@inject(Element)
export class FormGroup {

constructor(element) {
this.element = element;
}

@bindable
attribute

@bindable
message

}

0 comments on commit ef9b8d1

Please sign in to comment.