Ytukyg

I am trying to send form data into Server but when i click on Next Button ( Wizard Form ) It Give me error. I used Wizard Form and On step 1 when user click on Next Button the form data should send to the server but in meantime it give me error and in Console it warn me ( Undefined User ) :

" {error: 400, reason: "Match failed", message: "Match failed [400]",
errorType: "Meteor.Error"}

Code

import React from 'react';

import 'antd/dist/antd.css';

import './WizarStyle.css';

import styled from 'styled-components';

import { Steps, Form, Button, Card } from 'antd';

import RegisterStepOne from '../RegisterStepOne/RegisterStepOne';

import RegisterStepTwo from '../RegisterStepTwo/RegisterStepTwo';

import RegisterStepThree from '../RegisterStepThree/RegisterStepThree';

import RegisterStepFour from '../RegisterStepFour/RegisterStepFour';

const Step = Steps.Step;

const GeneralText = styled.div`

  color: red;

  font-size: 26px;

  font-weight: 600;

  text-align: center;

  padding-bottom: 30px;

  font-family: Lato;

  margin-top: 50px;

  color: #012653;

`;

const ButtonWrapper = styled.div`

  text-align: center;

  margin-top: 26px;

`;

class Wizard extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      current: 0,

      // user: null,

    };

  }



  steps = [

    {

      title: 'General Information',

      content: (

        <RegisterStepOne

          getFieldDecorator={this.props.form.getFieldDecorator}

        />

      ),

    },

    {

      title: 'Upload Photo',

      content: (

        <RegisterStepTwo

          getFieldDecorator={this.props.form.getFieldDecorator}

        />

      ),

    },

    {

      title: 'Upload Resume',

      content: (

        <RegisterStepThree

          getFieldDecorator={this.props.form.getFieldDecorator}

        />

      ),

    },

    {

      title: 'Add Skills',

      content: (

        <RegisterStepFour

          getFieldDecorator={this.props.form.getFieldDecorator}

        />

      ),

    },

  ];



  next() {

    this.setState(prevState => ({ current: prevState.current + 1 }));

  }



  handleSubmit = e => {

    e.preventDefault();

    this.props.form.validateFieldsAndScroll((err, values) => {

      if (!err) {

        // this.setState({ user: [this.state.user, values] });

        const userOject = {

          profile: {

            type: 'employee',

            screen: 'Step0',

          },

          ...values,

        };

        fetch('http://138.197.207.41:9000/api/auth/createuser', {

          method: 'POST',

          headers: {

            Accept: 'application/json',

            'Content-Type': 'application/json',

          },

          body: JSON.stringify({

            userOject,

          }),

        })

          .then(response => response.json())

          .then(user => {

            if (user.error) {

              console.warn(user);

            } else if (user && user.user) {

              console.warn(user);

            }

          });

      }

    });

  };



  prev() {

    this.setState(prevState => ({ current: prevState.current - 1 }));

  }



  getStep = props => this.steps[this.state.current].content;



  render() {

    const { current } = this.state;

    const { getFieldDecorator } = this.props.form;

    return (

      <Card style={{ borderRadius: 10 }}>

        <Form onSubmit={this.handleSubmit}>

          <GeneralText>{this.steps[current].title}</GeneralText>

          <Steps current={current}>

            {this.steps.map((item, index) => (

              <Step key={index.toString()} small="small" />

            ))}

          </Steps>

          <div className="steps-content">{this.getStep(getFieldDecorator)}</div>

          <div className="steps-action">

            {' '}

            <ButtonWrapper>

              {current < this.steps.length - 1 && (

                <Button

                  type="primary"

                  htmlType="submit"

                  style={{

                    background: '#ff9700',

                    fontWeight: 'bold',

                    border: 'none',

                  }}

                >

                  Next

                </Button>

              )}

              {current === this.steps.length - 1 && (

                <Button

                  type="primary"

                  htmlType="submit"

                  style={{

                    background: '#ff9700',

                    fontWeight: 'bold',

                    border: 'none',

                  }}

                >

                  Done

                </Button>

              )}

              {current > 0 && (

                <Button

                  className="preButton"

                  style={{ marginLeft: 8, border: '1px solid #ff9700' }}

                  onClick={() => this.prev()}

                >

                  Previous

                </Button>

              )}

            </ButtonWrapper>

          </div>

        </Form>

      </Card>

    );

  }

}

export default Form.create()(Wizard);

"

This is a server error, it means your parameters didn't match the check function.