2016-06-02 2 views
1

일부 필드가있는 양식을 제출할 때 이상한 결함이 있습니다. 이 코드는 다음과 같습니다.일부 필드가 비어있을 때 양식이 제출되지 않습니다.

... 
constructor(props) { 
    super(props); 
    this.state = { 
     form: { 
      email: '', 
      password: '', 
      retype: '' 
     } 
    }; 
}, 
_updateTextbox(type, ev) { 
    var oldState = this.state; 
    var newFormState = Object.assign({}, this.state.form, { 
     [type]: ev.target.value 
    }); 

    this.setState(Object.assign({}, this.state, { 
     form: newFormState 
    })); 
} 
_submit(ev) { 
    alert('Submit!'); 
    ev.preventDefault(); 
}, 
render(){ 
    return (
     <form onSubmit={this._submit.bind(this)}> 
      <input type="email" onChange={this._updateTextbox.bind(this, 'email')} value={this.state.form.email} /> 
      <input type="password" onChange={this._updateTextbox.bind(this, 'password')} value={this.state.form.password} /> 
      <input type="password" onChange={this._updateTextbox.bind(this, 'retype')} value={this.state.form.retype} /> 

      <button type="submit">Submit</button> 
     </form> 
    ); 
} 
... 

빈 필드가 모두있는이 양식을 제출하면 작동합니다. 하지만 전자 메일 필드 만 입력하면 폼은 비어있는 다른 필드를 제출하지 않습니다. 당신은 내가 이벤트를 제출할 때 경고하는 것을 사용했음을 알 수 있지만, 결코 나타나지 않는다. 나는 왜 그것이 일어나고 있는지 모른다. 이게 무슨 결함일까요?

답변

0

오류가 발생했습니다. ev.preventDefault(); }, < < < < 쉼표

편집 전체 코드는

import React, { Component } from 'react' 

class Example extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     form: { 
     email: '', 
     password: '', 
     retype: '' 
     } 
    }; 
    } 
    _updateTextbox(type, ev) { 
    var newFormState = Object.assign({}, this.state.form, { 
     [type]: ev.target.value 
    }); 

    this.setState(Object.assign({}, this.state, { 
     form: newFormState 
    })); 
    } 
    _submit(ev) { 
    alert('Submit!'); 
    ev.preventDefault(); 
    } 
    render(){ 
    return (
     <form onSubmit={this._submit.bind(this)}> 
      <input type="email" onChange={this._updateTextbox.bind(this, 'email')} value={this.state.form.email} /> 
      <input type="password" onChange={this._updateTextbox.bind(this, 'password')} value={this.state.form.password} /> 
      <input type="password" onChange={this._updateTextbox.bind(this, 'retype')} value={this.state.form.retype} /> 

      <button type="submit">Submit</button> 
     </form> 
    ); 
    } 
} 

export default Example 

는 죄송합니다 capture

+0

오 참조하십시오. 그건 실수 였어. 나는 편집했다. – modernator

+0

그리고 지금 작동합니까? 내게 그것은 –

+0

아니요, 그건 중요하지 않습니다, 위의 코드는 단지 설명을 위해 썼습니다. 여전히 작동하지 않습니다 : ( – modernator

관련 문제