diff --git a/assets/js/src/form/form.jsx b/assets/js/src/form/form.jsx
new file mode 100644
index 0000000000..0dc273f8e3
--- /dev/null
+++ b/assets/js/src/form/form.jsx
@@ -0,0 +1,167 @@
+define(
+ [
+ 'react',
+ 'mailpoet',
+ 'classnames',
+ 'react-router'
+ ],
+ function(
+ React,
+ MailPoet,
+ classNames,
+ Router
+ ) {
+
+ var FormField = React.createClass({
+ render: function() {
+ return (
+
+
+
+ |
+
+
+ |
+
+ );
+ }
+ });
+
+ var Form = React.createClass({
+ mixins: [
+ Router.Navigation
+ ],
+ getInitialState: function() {
+ return {
+ loading: false,
+ errors: [],
+ item: {}
+ };
+ },
+ componentDidMount: function() {
+ if(this.props.params.id !== undefined) {
+ if(this.isMounted()) {
+ this.loadItem(this.props.params.id);
+ }
+ }
+ },
+ componentWillReceiveProps: function(props) {
+ if(props.params.id === undefined) {
+ this.setState({
+ loading: false,
+ item: {}
+ });
+ } else {
+ this.loadItem(props.params.id);
+ }
+ },
+ loadItem: function(id) {
+ this.setState({ loading: true });
+
+ MailPoet.Ajax.post({
+ endpoint: 'subscribers',
+ action: 'get',
+ data: { id: id }
+ }).done(function(response) {
+ if(response === false) {
+ this.setState({
+ loading: false,
+ item: {}
+ }, function() {
+ this.transitionTo('/new');
+ }.bind(this));
+ } else {
+ this.setState({
+ loading: false,
+ item: response
+ });
+ }
+ }.bind(this));
+ },
+ handleSubmit: function(e) {
+ e.preventDefault();
+
+ this.setState({ loading: true });
+
+ MailPoet.Ajax.post({
+ endpoint: 'subscribers',
+ action: 'save',
+ data: this.state.item
+ }).done(function(response) {
+ this.setState({ loading: false });
+
+ if(response === true) {
+ this.transitionTo('/');
+ if(this.props.params.id !== undefined) {
+ MailPoet.Notice.success('Subscriber succesfully updated!');
+ } else {
+ MailPoet.Notice.success('Subscriber succesfully added!');
+ }
+
+ } else {
+ this.setState({ errors: response });
+ }
+ }.bind(this));
+ },
+ handleValueChange: function(e) {
+ var item = this.state.item;
+ item[e.target.name] = e.target.value;
+ this.setState({
+ item: item
+ });
+ return true;
+ },
+ render: function() {
+ var errors = this.state.errors.map(function(error, index) {
+ return (
+ { error }
+ );
+ });
+
+ var formClasses = classNames(
+ { 'mailpoet_form_loading': this.state.loading }
+ );
+
+ var fields = this.props.fields.map(function(field, index) {
+ return (
+
+ );
+ }.bind(this));
+
+ return (
+
+ );
+ }
+ });
+
+ return Form;
+ }
+);
\ No newline at end of file
diff --git a/assets/js/src/listing/listing.jsx b/assets/js/src/listing/listing.jsx
index 1c7f1cdfa2..2c8297cb88 100644
--- a/assets/js/src/listing/listing.jsx
+++ b/assets/js/src/listing/listing.jsx
@@ -72,7 +72,10 @@ define(
{
(this.props.loading === true)
@@ -97,7 +100,10 @@ define(
return (
|
-
+ |
{ MailPoetI18n.selectAllLabel }
{ error }
- );
- });
-
- var formClasses = classNames(
- { 'mailpoet_form_loading': this.state.loading }
- );
return (
-
+
);
}
});
- return Form;
+ return SubscriberForm;
}
);
\ No newline at end of file
|