Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 3b012cd

Browse files
committed
Merge branch 'master-origin' into feature/468-unique-ids
* master-origin: migrated VFG docs to newer GitBooks, created GitHub Repo for Docs to allow for easier maintenance, updated JSFiddle to use "latest" VFG, and created a CodePen version as well Codacy (guard-for-in) fix fixed code structure added "options" to VFG install function, appending custom "validators" to the validators object that are passed into `Vue.use(VueFormGenerator, { validators: { key: (value, field, model) => {} }) fixed single-quotes added "type" attribute to inside buttons schema, defaults to "button" when one is not provided added "item.disabled" logic, supporting both boolean values and a function that is passed a reference to the model to determine disabled logic based on the model. listen for model-updated from `fields`, and fix `debounceFormatFunction` property to match fieldInput's `debounceFormatFunc` instead. # Conflicts: # src/fields/core/fieldRadios.vue
2 parents ab1daeb + 4cc7a7a commit 3b012cd

File tree

6 files changed

+32
-10
lines changed

6 files changed

+32
-10
lines changed

‎README.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,10 @@ A schema-based form generator component for Vue.js.
1515

1616
## Demo
1717

18-
[JSFiddle simple example](https://jsfiddle.net/icebob/0mg1v81e/)
18+
[JSFiddle simple example](https://jsfiddle.net/zoul0813/d8excp36/)
19+
[CodePen simple example](https://codepen.io/zoul0813/pen/OrNVNw)
1920

20-
[![Screenshot](https://icebob.gitbooks.io/vueformgenerator/content/assets/vfg-example1.png)](https://jsfiddle.net/icebob/0mg1v81e/)
21+
[![Screenshot](https://github.com/vue-generators/vue-form-generator-docs/raw/master/assets/vfg-example1.png)](https://jsfiddle.net/zoul0813/d8excp36/)
2122

2223
## Features
2324

@@ -33,7 +34,7 @@ A schema-based form generator component for Vue.js.
3334

3435
## Documentation
3536

36-
[Online documentation on Gitbook](https://icebob.gitbooks.io/vueformgenerator/content/)
37+
[Online documentation on Gitbook](https://vue-generators.gitbook.io/vue-generators/)
3738

3839
## Dependencies
3940

@@ -43,7 +44,7 @@ While built-in fields don't need external dependencies, optional fields may need
4344
These dependencies fall into two camps: jQuery or Vanilla. You can find almost the same functionality in both flavors.
4445
In the end, it's your choice to depend on jQuery or not.
4546

46-
You can find details about dependencies in the official [documentation](https://icebob.gitbooks.io/vueformgenerator/content/) under each specific component.
47+
You can find details about dependencies in the official [documentation](https://vue-generators.gitbook.io/vue-generators/) under each specific component.
4748

4849
## Installation
4950

‎src/fields/abstractField.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export default {
3131
return {
3232
errors: [],
3333
debouncedValidateFunc: null,
34-
debouncedFormatFunction: null
34+
debouncedFormatFunc: null
3535
};
3636
},
3737

‎src/fields/core/fieldRadios.vue

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<template lang="pug">
22
.radio-list(:disabled="disabled", v-attributes="'wrapper'")
33
label(v-for="item in items", :class="{'is-checked': isItemChecked(item)}", v-attributes="'label'")
4-
input(:id="getFieldID(schema, true)", type="radio", :disabled="disabled", :name="id", @click="onSelection(item)", :value="getItemValue(item)", :checked="isItemChecked(item)", :class="schema.fieldClasses", :required="schema.required", v-attributes="'input'")
4+
input(:id="getFieldID(schema, true)", type="radio", :disabled="isItemDisabled(item)", :name="id", @click="onSelection(item)", :value="getItemValue(item)", :checked="isItemChecked(item)", :class="schema.fieldClasses", :required="schema.required", v-attributes="'input'")
55
| {{ getItemName(item) }}
66

77
</template>
88

99
<script>
10-
import { isObject } from "lodash";
10+
import { isObject, isFunction, getasobjGet } from "lodash";
1111
import abstractField from "../abstractField";
1212
1313
export default {
@@ -64,6 +64,16 @@ export default {
6464
isItemChecked(item) {
6565
let currentValue = this.getItemValue(item);
6666
return currentValue === this.value;
67+
},
68+
isItemDisabled(item) {
69+
if (this.disabled) {
70+
return true;
71+
}
72+
let disabled = objGet(item, "disabled", false);
73+
if (isFunction(disabled)) {
74+
return disabled(this.model);
75+
}
76+
return disabled;
6777
}
6878
}
6979
};

‎src/formGenerator.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
div.vue-form-generator(v-if='schema != null')
33
fieldset(v-if="schema.fields", :is='tag')
44
template(v-for='field in fields')
5-
form-group(v-if='fieldVisible(field)', :vfg="vfg", :field="field", :errors="errors", :model="model", :options="options", @validated="onFieldValidated")
5+
form-group(v-if='fieldVisible(field)', :vfg="vfg", :field="field", :errors="errors", :model="model", :options="options", @validated="onFieldValidated", @model-updated="onModelUpdated")
66

77
template(v-for='group in groups')
88
fieldset(:is='tag', :class='getFieldRowClasses(group)')

‎src/formGroup.vue

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<div class="field-wrap">
1212
<component ref="child" :is="getFieldType(field)" :vfg="vfg" :disabled="fieldDisabled(field)" :model="model" :schema="field" :formOptions="options" @model-updated="onModelUpdated" @validated="onFieldValidated"></component>
1313
<div v-if="buttonVisibility(field)" class="buttons">
14-
<button v-for="(btn, index) in field.buttons" @click="buttonClickHandler(btn, field, $event)" :class="btn.classes" :key="index" v-text="btn.label"></button>
14+
<button v-for="(btn, index) in field.buttons" @click="buttonClickHandler(btn, field, $event)" :class="btn.classes" :key="index" v-text="btn.label":type="getButtonType(btn)"></button>
1515
</div>
1616
</div>
1717

@@ -81,6 +81,10 @@ export default {
8181
getFieldType(fieldSchema) {
8282
return "field-" + fieldSchema.type;
8383
},
84+
// Get type of button, default to 'button'
85+
getButtonType(btn) {
86+
return objGet(btn, "type", "button");
87+
},
8488
// Child field executed validation
8589
onFieldValidated(res, errors, field) {
8690
this.$emit("validated", res, errors, field);

‎src/index.js

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,15 @@ const schema = require("./utils/schema.js");
33
const validators = require("./utils/validators.js").default;
44
const fieldComponents = require("./utils/fieldsLoader").default;
55
const abstractField = require("./fields/abstractField").default;
6-
const install = (Vue) => {
6+
const install = (Vue,options) => {
77
Vue.component("VueFormGenerator", module.exports.component);
8+
if (options && options.validators) {
9+
for (let key in options.validators) {
10+
if ({}.hasOwnProperty.call(options.validators, key)) {
11+
validators[key] = options.validators[key];
12+
}
13+
}
14+
}
815
};
916

1017
module.exports = {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /