form-dynamic-ajax 7.0.4 → 7.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +58 -61
- package/esm2022/form-dynamic-ajax.mjs +1 -1
- package/esm2022/lib/form-dynamic-angular.component.mjs +4 -3
- package/esm2022/lib/form-dynamic-angular.module.mjs +6 -2
- package/esm2022/public-api.mjs +2 -2
- package/fesm2022/form-dynamic-ajax.mjs +9 -4
- package/fesm2022/form-dynamic-ajax.mjs.map +1 -1
- package/lib/form-dynamic-angular.component.d.ts +1 -1
- package/lib/form-dynamic-angular.module.d.ts +3 -2
- package/package.json +4 -6
package/README.md
CHANGED
|
@@ -1,21 +1,20 @@
|
|
|
1
1
|
# FORM DYNAMIC ANGULAR
|
|
2
2
|
|
|
3
|
-
|
|
4
4
|
|
|
5
5
|
## Description
|
|
6
|
-
The form-dynamic is a solution whith objectve is minimize the coding in forms, so one json you can have mutch components in forms in primeng as: input (text and number), select, treeSelect, autocomplete, date, dateTime, textarea, checkbox, button, upload files, list e radioButton
|
|
7
6
|
|
|
7
|
+
The form-dynamic is a solution whith objectve is minimize the coding in forms, so one json you can have mutch components in forms in primeng as: input (text and number), select, treeSelect, autocomplete, date, dateTime, textarea, checkbox, button, upload files, list e radioButton
|
|
8
8
|
|
|
9
|
-
| Lib version | Angular version
|
|
10
|
-
|
|
|
11
|
-
| `4.1.3`
|
|
12
|
-
| `5.0.6`
|
|
9
|
+
| Lib version | Angular version |
|
|
10
|
+
| :---------- | :-------------- |
|
|
11
|
+
| `4.1.3` | `15.2.0` |
|
|
12
|
+
| `5.0.6` | `17.0.0` |
|
|
13
13
|
|
|
14
14
|
## Basic Usage 📑
|
|
15
|
-
```html
|
|
16
|
-
|
|
17
|
-
<form-dynamic-angular title="Exemple" [form]=formmExemple [control]=controlExemple></form-dynamic-angular>
|
|
18
15
|
|
|
16
|
+
```html
|
|
17
|
+
<form-dynamic-angular title="Exemple" [form]="formmExemple" [control]="controlExemple"></form-dynamic-angular>
|
|
19
18
|
```
|
|
20
19
|
|
|
21
20
|
```js
|
|
@@ -24,7 +23,7 @@ import { IForm } from 'form-dynamic-angular';
|
|
|
24
23
|
|
|
25
24
|
export class AppComponent implements OnInit {
|
|
26
25
|
|
|
27
|
-
controlExemple: UntypedFormGroup
|
|
26
|
+
controlExemple: UntypedFormGroup
|
|
28
27
|
formmExemple: IForm[] = []
|
|
29
28
|
|
|
30
29
|
constructor(
|
|
@@ -48,60 +47,58 @@ export class AppComponent implements OnInit {
|
|
|
48
47
|
|
|
49
48
|
## Props 💬
|
|
50
49
|
|
|
51
|
-
| Prop
|
|
52
|
-
|
|
53
|
-
| `title`
|
|
54
|
-
| `subTitle`
|
|
55
|
-
| `control`
|
|
56
|
-
| `form`
|
|
57
|
-
| `files`
|
|
58
|
-
| `validateForm`
|
|
59
|
-
| `buttonsStandard` | `IButtonsStandard[]` | `[]`
|
|
60
|
-
| `buttonsOptional` | `IButtonsOptional[]` | `[]`
|
|
61
|
-
|
|
50
|
+
| Prop | Type | Default | Description |
|
|
51
|
+
| :---------------- | :------------------- | :---------- | :-------------------------------------------- |
|
|
52
|
+
| `title` | `string` | `''` | Title page |
|
|
53
|
+
| `subTitle` | `string` | `''` | Sub title page |
|
|
54
|
+
| `control` | `UntypedFormGroup` | `undefined` | Controls the form |
|
|
55
|
+
| `form` | `IForm[]` | `[]` | Input list |
|
|
56
|
+
| `files` | `File[]` | `[]` | Upload files |
|
|
57
|
+
| `validateForm` | `boolean` | `false` | if inputs have validation |
|
|
58
|
+
| `buttonsStandard` | `IButtonsStandard[]` | `[]` | Inputs standard (clean, filter, save, cancel) |
|
|
59
|
+
| `buttonsOptional` | `IButtonsOptional[]` | `[]` | Inputs optional |
|
|
62
60
|
|
|
63
61
|
## Props Inputs 💬
|
|
64
62
|
|
|
65
|
-
| Prop
|
|
66
|
-
|
|
67
|
-
| `id`
|
|
68
|
-
| `label`
|
|
69
|
-
| `type`
|
|
70
|
-
| `disabled`
|
|
71
|
-
| `col`
|
|
72
|
-
| `formControl`
|
|
73
|
-
| `required`
|
|
74
|
-
| `placeholder`
|
|
75
|
-
| `onChange`
|
|
76
|
-
| `search`
|
|
77
|
-
| `options`
|
|
78
|
-
| `treeSelectOptions`
|
|
79
|
-
| `numberOfMonthsDate` | ` number`
|
|
80
|
-
| `selectionMode`
|
|
81
|
-
| `minDate`
|
|
82
|
-
| `maxDate`
|
|
83
|
-
| `viewDate`
|
|
84
|
-
| `dateFormat`
|
|
85
|
-
| `timeOnly`
|
|
86
|
-
| `showTime`
|
|
87
|
-
| `rowsTextArea`
|
|
88
|
-
| `maxlength`
|
|
63
|
+
| Prop | Type | Required | type input | Description |
|
|
64
|
+
| :------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------- | :---------------------------------------------------------------------------------------------- | :------------------------------- |
|
|
65
|
+
| `id` | `string or number` | `yes` | `all` | Id unic |
|
|
66
|
+
| `label` | `string` | `no` | `all` | Label |
|
|
67
|
+
| `type` | ` autocomplete or button or check-box or currency or check-box-multi or date or switch or list or likert or mask or multi or number or password or photo or radio-button or select or select-button or table or text or text-area or tree-select or upload-files` | `yes` | `all` | Type |
|
|
68
|
+
| `disabled` | `boolean or null` | `no` | `button or upload-files` | Disabled |
|
|
69
|
+
| `col` | `string` | `no` | `all` | Class grid primeflex |
|
|
70
|
+
| `formControl` | ` string` | `no` | `all` | Controler input |
|
|
71
|
+
| `required` | `boolean` | `no` | `all` | If input is required |
|
|
72
|
+
| `placeholder` | `string` | `no` | `all` | Placeholder |
|
|
73
|
+
| `onChange` | `Function` | `no` | `all` | Change |
|
|
74
|
+
| `search` | `boolean` | `no` | `select` | If input search |
|
|
75
|
+
| `options` | ` IOptions[]` | `no` | `select or autocomplete or list or multi or radio-button or checkbox-multiple or select-button` | Options view |
|
|
76
|
+
| `treeSelectOptions` | ` ITreeSelectOptions[]` | `no` | `tree-select` | Options tree select |
|
|
77
|
+
| `numberOfMonthsDate` | ` number` | `no` | `date` | Quantity months views, default 1 |
|
|
78
|
+
| `selectionMode` | ` multiple or range or single` | `no` | `date` | Mode selection dates |
|
|
79
|
+
| `minDate` | `Date` | `no` | `date` | Min Date |
|
|
80
|
+
| `maxDate` | `Date` | `no` | `date` | Max Date |
|
|
81
|
+
| `viewDate` | `month or date` | `no` | `date` | View only month or date |
|
|
82
|
+
| `dateFormat` | `string` | `no` | `date` | Format date |
|
|
83
|
+
| `timeOnly` | `boolean` | `no` | `date` | View only time |
|
|
84
|
+
| `showTime` | ` boolean` | `no` | `date` | if view time in date |
|
|
85
|
+
| `rowsTextArea` | ` number` | `no` | `text-area` | Quantity rows in text-area |
|
|
86
|
+
| `maxlength` | ` number` | `no` | `text-area` | Count words |
|
|
89
87
|
|
|
90
88
|
| `colsTable` | ` ICols[]` | `no` | `table` | Cols table
|
|
91
89
|
| `forceSelection` | ` ICols[]` | `no` | `table` | Cols table
|
|
92
|
-
| `clean` | `Function` | `no` | `tree-select` | Function clear
|
|
93
|
-
| `onCLick` | `Function` | `no` | `button` | Function clear
|
|
94
|
-
| `icon` | `string` | `no` | `button` | Icon Button
|
|
95
|
-
| `textButton` | `string` | `no` | `button` | Text Button
|
|
96
|
-
| `onFocusDate` | `Function` | `no` | `date` | Functions focus
|
|
97
|
-
| `onFocusDate` | `Function` | `no` | `date` | Functions focus
|
|
90
|
+
| `clean` | `Function` | `no` | `tree-select` | Function clear
|
|
91
|
+
| `onCLick` | `Function` | `no` | `button` | Function clear
|
|
92
|
+
| `icon` | `string` | `no` | `button` | Icon Button
|
|
93
|
+
| `textButton` | `string` | `no` | `button` | Text Button
|
|
94
|
+
| `onFocusDate` | `Function` | `no` | `date` | Functions focus
|
|
95
|
+
| `onFocusDate` | `Function` | `no` | `date` | Functions focus
|
|
98
96
|
| `selectionMode` | `multiple or range or single` | `no` | `date` | Amount month is view in date
|
|
99
97
|
| `acceptFiles` | `string` | `no` | `upload-files` | Formats accepts
|
|
100
98
|
| `msgAcceptFiles` | `string` | `no` | `upload-files` | Message accepts
|
|
101
99
|
| `mask` | `string` | `no` | `mask` | type mask
|
|
102
100
|
| `unmask` | `boolean` | `no` | `mask` | If control user mask or no
|
|
103
101
|
|
|
104
|
-
|
|
105
102
|
## Usage Inputs
|
|
106
103
|
|
|
107
104
|
1- Autocomplete | List | Radio-button | Select | Select-button | Multi
|
|
@@ -167,7 +164,7 @@ this.formmAutocomplete = [
|
|
|
167
164
|
|
|
168
165
|
```
|
|
169
166
|
|
|
170
|
-
3- Date
|
|
167
|
+
3- Date
|
|
171
168
|
|
|
172
169
|
```js
|
|
173
170
|
|
|
@@ -184,7 +181,7 @@ this.formmAutocomplete = [
|
|
|
184
181
|
|
|
185
182
|
```
|
|
186
183
|
|
|
187
|
-
4- Switch |
|
|
184
|
+
4- Switch | Text | Text-area | Number | Password | Currency
|
|
188
185
|
|
|
189
186
|
```js
|
|
190
187
|
|
|
@@ -324,6 +321,7 @@ this.form = [
|
|
|
324
321
|
]
|
|
325
322
|
|
|
326
323
|
```
|
|
324
|
+
|
|
327
325
|
## Required
|
|
328
326
|
|
|
329
327
|
```js
|
|
@@ -347,13 +345,13 @@ this.form = [
|
|
|
347
345
|
save() {
|
|
348
346
|
this.validateForm = true
|
|
349
347
|
}
|
|
350
|
-
|
|
351
|
-
```
|
|
352
|
-
```html
|
|
353
348
|
|
|
354
|
-
|
|
349
|
+
```
|
|
355
350
|
|
|
351
|
+
```html
|
|
352
|
+
<form-dynamic-angular title="Exemple" [form]="form" [control]="control" [validateForm]="validateForm" [buttonsStandard]="buttonsStandard"></form-dynamic-angular>
|
|
356
353
|
```
|
|
354
|
+
|
|
357
355
|
## Translate
|
|
358
356
|
|
|
359
357
|
Created files
|
|
@@ -384,8 +382,7 @@ Created input and form
|
|
|
384
382
|
```html
|
|
385
383
|
<!--app.component.html-->
|
|
386
384
|
|
|
387
|
-
<form-dynamic-angular title="Login" [form]=formLogin [control]=controlLogin></form-dynamic-angular>
|
|
388
|
-
|
|
385
|
+
<form-dynamic-angular title="Login" [form]="formLogin" [control]="controlLogin"></form-dynamic-angular>
|
|
389
386
|
```
|
|
390
387
|
|
|
391
388
|
Created function
|
|
@@ -399,7 +396,7 @@ import { IForm } from 'form-dynamic-angular';
|
|
|
399
396
|
|
|
400
397
|
export class AppComponent implements OnInit {
|
|
401
398
|
|
|
402
|
-
controlLogin: UntypedFormGroup
|
|
399
|
+
controlLogin: UntypedFormGroup
|
|
403
400
|
formLogin: IForm[] = []
|
|
404
401
|
|
|
405
402
|
constructor(
|
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
* Generated bundle index. Do not edit.
|
|
3
3
|
*/
|
|
4
4
|
export * from './public-api';
|
|
5
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1keW5hbWljLWFqYXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9wcm9qZWN0cy9mb3JtLWR5bmFtaWMtYWpheC9zcmMvZm9ybS1keW5hbWljLWFqYXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==
|