Skip to content

Commit 69463ad

Browse files
committed
Docs update, submitting form
1 parent bba706d commit 69463ad

File tree

1 file changed

+63
-1
lines changed

1 file changed

+63
-1
lines changed

docs/index.md

Lines changed: 63 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ Documentation
22
=============
33

44
1. [Basic Usage](#basic-usage)
5+
1. [Handling Submit](#handling-submit)
56
1. [Global Options](#global-options)
67
1. [Form types](#form-types)
78
1. [Default form types](#default-form-types)
@@ -79,6 +80,67 @@ Example with custom submit buttons:
7980
</div>
8081
```
8182

83+
Handling Submit
84+
---------------
85+
Schema Form does not care what you do with your data, to handle form submit
86+
the recomended way is to use the `ng-submit` directive. It's also recomended
87+
to use a `name` attribute on your form so you can access the
88+
[FormController](https://code.angularjs.org/1.3.0-beta.15/docs/api/ng/type/form.FormController)
89+
and check if the form is valid or not.
90+
91+
You can force a validation by broadcasting the event `schemaFormValidate`, ex
92+
`$scope.$broadcast('schemaFormValidate')`, this will immediately validate the
93+
entire form and show any errors.
94+
95+
Example submit:
96+
```javascript
97+
function FormController($scope) {
98+
$scope.schema = {
99+
type: "object",
100+
properties: {
101+
name: { type: "string", minLength: 2, title: "Name", description: "Name or alias" },
102+
title: {
103+
type: "string",
104+
enum: ['dr','jr','sir','mrs','mr','NaN','dj']
105+
}
106+
}
107+
};
108+
109+
$scope.form = [
110+
"*",
111+
{
112+
type: "submit",
113+
title: "Save"
114+
}
115+
];
116+
117+
$scope.model = {};
118+
119+
$scope.onSubmit = function(form) {
120+
// First we broadcast an event so all fields validate themselves
121+
$scope.$broadcast('schemaFormValidate');
122+
123+
// Then we check if the form is valid
124+
if (form.$valid) {
125+
// ... do whatever you need to do with your data.
126+
}
127+
}
128+
}
129+
130+
```
131+
132+
And the HTML would be something like this:
133+
```html
134+
<div ng-controller="FormController">
135+
<form name="myForm"
136+
sf-schema="schema"
137+
sf-form="form"
138+
sf-model="model"
139+
ng-submit="onSubmit(myForm)"></form>
140+
</div>
141+
```
142+
143+
82144
Global Options
83145
--------------
84146
Schema Form also have two options you can set globally via the `sf-options`
@@ -342,7 +404,7 @@ Ex.
342404
```
343405

344406
See [Global Options](#global-options) for an example how you set entire form
345-
to validate on blur.
407+
to validate on blur.
346408

347409

348410
Specific options and types

0 commit comments

Comments
 (0)