Closed saty932 closed 3 years ago
I am submitting form but value of form submitted not updating.
<div class="modal-body"> <div class="form_1"> <div class="head_modal"> <h3>Let’s Talk</h3> </div> <FieldGroup control={this.contactUsForm} render={({ get,pristine}) => ( <form onSubmit={e => this.handleSubmit(e)}> <div class="form-group"> <label class="label_custom" for="user">I’m a</label> {/* <input type="text" class="form-control custom_input" id="user" placeholder="" /> */} <FieldControl name="userType" formState="guest" options={{validators: Validators.required }} render={({ handler, touched, hasError }) => ( <div> <select className="form-control custom_input" id="userType" name="userType" {...handler()} > > <option value="guest">Guest</option> <option value="brand">Brand</option> <option value="property">Property</option> </select> <span> {touched && hasError('required') && 'User Type is required'} </span> </div> )} /> </div> {this.contactUsForm.value.userType==='brand'&&( <div class="form-group"> <label class="label_custom" for="brandName">Brand Name</label> {/* <input type="text" class="form-control custom_input" id="brandName" placeholder="Enter Brand Name" /> */} <FieldControl name="brandName" options={{validators: Validators.required }} render={({ handler, touched, hasError}) => ( <div> <input className="form-control custom_input" id="brandName" placeholder="Enter Brand Name" {...handler()} /> <span> { hasError('required') && 'Brand Name is required'} </span> </div> )} /> </div> )} {this.contactUsForm.value.userType==='property'&&( <div class="form-group"> <label class="label_custom" for="detail">Property Name</label> {/* <input type="text" class="form-control custom_input" placeholder="Detail goes here..." /> */} <FieldControl name="propertyName" options={{validators: Validators.required }} render={({ handler, touched, hasError,submitted}) => ( <div> <input class="form-control custom_input" id="propertyName" placeholder="Property Name..." {...handler()} /> <span> {touched && hasError('required') && 'Property Name is required'} </span> </div> )} /> </div> )} {this.contactUsForm.value.userType==='property'&&( <div class="form-group"> <label class="label_custom" for="detail">Property Address</label> {/* <input type="text" class="form-control custom_input" placeholder="Detail goes here..." /> */} <FieldControl name="propertyAddress" options={{validators: Validators.required }} render={({ handler, touched, hasError,submitted }) => ( <div> <input class="form-control custom_input" id="propertyAddress" placeholder="Property Addresss..." {...handler()} /> <span> {touched && hasError('required') && 'Property Address is required'} </span> </div> )} /> </div> )} <div class="form-group"> <label class="label_custom" for="contactName">Contact Name</label> {/* <input type="email" class="form-control custom_input" id="contactName" placeholder="Enter contact name" /> */} <FieldControl name="contactName" options={{ validators: Validators.required }} render={({ handler, touched, hasError,submitted }) => ( <div> <input class="form-control custom_input" id="contactName" placeholder="Enter contact Name" {...handler()} /> <span> {touched && hasError('required') && 'Contact Name is required'} </span> </div> )} /> </div> <div class="form-group"> <label class="label_custom" for="email">Email</label> {/* <input type="email" class="form-control custom_input" id="emailAddress" placeholder="Enter your email" /> */} <FieldControl name="email" options={{ validators: [Validators.required,Validators.email] }} render={({ handler, touched, hasError,submitted }) => ( <div> <input class="form-control custom_input" id="email" placeholder="Enter your email" {...handler()} /> <span> {touched && hasError('required') && 'Email is required'} </span> <span> {touched && hasError('email') && 'Email should be valid'} </span> </div> )} /> </div> <div class="form-group"> <label class="label_custom" for="contactNumber">Phone number</label> {/* <input type="text" class="form-control custom_input" id="contactNumber" placeholder="Enter contact number" /> */} <FieldControl name="contactNumber" options={{ validators: Validators.required }} render={({ handler, touched, submitted,hasError }) => ( <div class="form-control custom_input"> <PhoneInput placeholder="Enter phone number" id="contactNumber" {...handler()} /> {/* <input class="form-control custom_input" id="contactNumber" placeholder="Enter contact number" {...handler()} /> */} <span> {touched && hasError('required') && 'Phone Number is required'} </span> </div> )} /> </div> <div class="form-group"> <label class="label_custom" for="detail">Details</label> {/* <input type="text" class="form-control custom_input" placeholder="Detail goes here..." /> */} <FieldControl name="detail" render={({ handler, touched,submitted, hasError }) => ( <div> <input class="form-control custom_input" id="detail" placeholder="Detail goes here..." {...handler()} /> <span> {touched && hasError('required') && 'Details is required'} </span> </div> )} /> </div> <div class="footer_modal"> <div class="btn_container right_aligned"> <button class="btn btn_2" type="submit" disabled={pristine} style={{background:pristine?'gray':''}}>Send Message</button> </div> </div> </form> )} />
@saty932 Please share a code sandbox link that replicates the issue.
Closing since no activity. Feel free to repoen.
I am submitting form but value of form submitted not updating.