diff --git a/components/form/demo/form-in-modal.md b/components/form/demo/form-in-modal.md
new file mode 100644
index 0000000000..f3111ef40b
--- /dev/null
+++ b/components/form/demo/form-in-modal.md
@@ -0,0 +1,64 @@
+# 与 Modal 配合使用
+
+- order: 14
+
+在 Modal 中使用 Form,当点击 Modal 的确定时,调用 `this.props.form.getFieldsValue` 获取表单内的值。
+
+---
+
+````jsx
+import { Button, Form, Input, Modal } from 'antd';
+const createForm = Form.create;
+const FormItem = Form.Item;
+
+let Demo = React.createClass({
+ getInitialState() {
+ return { visible: false };
+ },
+
+ handleSubmit() {
+ console.log(this.props.form.getFieldsValue());
+ this.hideModal();
+ },
+
+ showModal() {
+ this.setState({ visible: true });
+ },
+
+ hideModal() {
+ this.setState({ visible: false });
+ },
+
+ render() {
+ const { getFieldProps } = this.props.form;
+
+ const formItemLayout = {
+ labelCol: { span: 4 },
+ wrapperCol: { span: 20 },
+ };
+ return (
+
+
+
+
+
+
+ );
+ }
+});
+
+Demo = createForm()(Demo);
+
+ReactDOM.render(, mountNode);
+````
diff --git a/components/form/demo/validate-customized.md b/components/form/demo/validate-customized.md
index d93b7b6cf2..07975f3ea0 100644
--- a/components/form/demo/validate-customized.md
+++ b/components/form/demo/validate-customized.md
@@ -9,7 +9,7 @@
---
````jsx
-import { Button, Form, Input, Row, Col, Modal } from 'antd';
+import { Button, Form, Input, Row, Col } from 'antd';
import classNames from 'classnames';
const createForm = Form.create;
const FormItem = Form.Item;
@@ -25,7 +25,6 @@ let Demo = React.createClass({
rePassBarShow: false,
passStrength: 'L', // 密码强度
rePassStrength: 'L',
- visible: false,
};
},
@@ -37,7 +36,6 @@ let Demo = React.createClass({
}
console.log('Submit!!!');
console.log(values);
- this.setState({ visible: false });
});
},
@@ -66,14 +64,6 @@ let Demo = React.createClass({
}
},
- showModal() {
- this.setState({ visible: true });
- },
-
- hideModal() {
- this.setState({ visible: false });
- },
-
checkPass(rule, value, callback) {
const form = this.props.form;
this.getPassStrenth(value, 'pass');
@@ -127,7 +117,6 @@ let Demo = React.createClass({
render() {
const { getFieldProps } = this.props.form;
- // 如果觉得在 JSX 中写 `getFieldProps` 会影响阅读,可以先用变量保存 `getFieldProps` 的返回值。
const passProps = getFieldProps('pass', {
rules: [
{ required: true, whitespace: true, message: '请填写密码' },
@@ -149,40 +138,46 @@ let Demo = React.createClass({
};
return (
-
-
-
+
+
+
);
}