I have several radio buttons, none of them appear correctly in the form submit data. Rather than fight way my HTML is formatted, I’d much rahter just get the key value pairs from the submitted form. Is that possible?
For example: Checking no on this ratio button displays Yes No in the submitted form, I would rater see evicted: no
<div class="form-group">
<label>Have you ever been evicted, asked to leave, or paid rent late? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="yes" required>Yes</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="no" required> No</label>
</div>
</div>
I discovered that downloading the .csv file has the field names as the column and the responses in the rows so I can use the download as a work around. I’d much rather see the key-value pairs in the UI and also in the forwarded email.
jen
April 21, 2020, 5:57pm
3
Hey @dalelotts ,name is “cheese” and value is either “yes” or “no”:
Is this what you’re going for? If so, I wonder if your form is missing some tags and causing it to be parsed in an unexpected way. Do you want to try wrapping your form in <form> tags and seeing if that helps? Here are more docs on form setup:
bldng
June 17, 2020, 8:27am
4
Hi @jen ,
I am struggling with a similar problem. The field names in the .csv are correctly using the name attributes values, but the Email and UI are using the labels dom content values. Based on your Example, the following field
<label for="topping-a">Cheese</label>[...]
would correctly be saved in the csv under topping-a, but in the Email and UI as “Cheese”. In my case, the client has no access to the csv, and parsing the Emails in their system is an unforeseen effort because we’d need to find a way to cast [“Cheese”, “Queso”, “Käse”, “Fromage”] back to “topping-a” as the forms are published in different languages.
Thanks for looking into this and please let me know if I should open a separate thread for it.
Hi @jen
I omitted the <form> tag for brevity. If it was not there it would not be found as a form by netlify and I would not get an email or a .csv file to download.
Do you want to try using the exact html I included and seeing if it works for you?
jen
June 17, 2020, 8:37pm
6
Hey @bldng ,
<form name="cheese-check" method="POST" netlify>
<p>Do you like cheese?</p>
<label>
<input type="radio" name="cheese" value="yes">Yes
</label>
<label>
<input type="radio" name="cheese" value="hell yes"> Hell yes
</label>
<button type="submit">Send</button>
</form>
There could be a few things happening with yours- multiple radio buttons, the for attribute, etc. Would you mind dropping the full form in so we can check it out?
jen
June 17, 2020, 8:41pm
7
Hey @dalelotts ,
<form name="eviction-form" method="POST" netlify>
<div class="form-group">
<label>Have you ever been evicted, asked to leave, or paid rent late? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="yes" required>Yes</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="no" required> No</label>
</div>
</div>
<button type="submit">Send</button>
</form>
This is what I see in the UI:
And in my email:
@jen If history is any indication, it’s gonna be my fault. I’m betting I made some silly mistake. =)
<form name="some-form-name" method="POST" data-netlify="true" data-netlify-honeypot="4f261126">
<fieldset>
<div class="form-group" style="position: absolute; left: -5000px">
<label for="4f261126">Invite code</label>
<input type="text" class="form-control" id="4f261126" name="4f261126" tabIndex="-1"/>
</div>
<div class="form-group">
<label for="name">Your Name <code>*</code></label>
<input id="name" name="name" type="text" required class="form-control"
placeholder="Your Name">
</div>
<div class="form-group">
<label for="emailAddress">Your Email address <code>*</code></label>
<input id="emailAddress" name="emailAddress" type="email" required class="form-control"
placeholder="Your Email address">
</div>
<div class="form-group">
<label for="mobile">Mobile Phone <code>*</code></label>
<input type="text" id="mobile" name="mobile" class="form-control"
placeholder="Mobile Phone Number" maxlength="20" required>
</div>
<div class="form-group">
<label for="moveIn">Move-In Date <code>*</code></label>
<input type="date" name="moveIn" id="moveIn" class="form-control" required/>
</div>
<div class="form-group">
<p>What is your credit score? <code>*</code></p>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="unknown"
required> I don't know my credit score
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="800-850"
required> 800-850
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="750-799"
required> 750-799
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="700-749"
required> 700-749
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="650-699"
required> 650-699
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="600-649"
required> 600-649
</label>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="radio" class="form-check-input" name="creditScore" value="300-599"
required> 300-599
</label>
</div>
</div>
<div class="form-group">
<label class="minimumIncome">Do you (and your co-tenants) make <u>at least</u> $5,925 (3
times rent) per month? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="minimumIncome" value="yes"
required>Yes</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="minimumIncome" value="no"
required>
No</label>
</div>
</div>
<div class="form-group">
<label class="moveInFundsAvailable">Do you (and your co-tenants) have funds available to pay
one month rent ($2,100), security deposit ($2,000), lease administration fee ($100),
and application fee ($55 per adult), (total: $4200 + $55 per adult)? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="moveInFundsAvailable"
id="moveInFundsAvailableYes" value="yes" required>
<label class="form-check-label" for="moveInFundsAvailableYes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="moveInFundsAvailable"
id="moveInFundsAvailableNo" value="no" required>
<label class="form-check-label" for="moveInFundsAvailableNo">No</label>
</div>
</div>
<div class="form-group">
<label class="section8">Are you using section 8, a voucher, or other subsidy to pay rent?
<code>*</code></label>
<br>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="section8" id="section8Yes"
value="yes" required>
<label class="form-check-label" for="section8Yes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="section8" id="section8No" value="no"
required>
<label class="form-check-label" for="section8No">No</label>
</div>
</div>
<div class="form-group">
<label class="smoker">Do you smoke? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="smoker" id="smokerYes" value="yes"
required>
<label class="form-check-label" for="smokerYes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="smoker" id="smokerNo" value="no"
required>
<label class="form-check-label" for="smokerNo">No</label>
</div>
</div>
<div class="form-group">
<label>Have you ever filed for bankruptcy? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="bankruptcy" id="bankruptcyYes"
value="yes"
required>
<label class="form-check-label" for="bankruptcyYes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="bankruptcy" id="bankruptcyNo"
value="no"
required>
<label class="form-check-label" for="bankruptcyNo">No</label>
</div>
</div>
<div class="form-group">
<label>Have you ever been arrested or charged with a crime other than a traffic violation?
<code>*</code></label>
<br>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="criminal" id="criminalYes"
value="yes"
required>
<label class="form-check-label" for="criminalYes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="criminal" id="criminalNo" value="no"
required>
<label class="form-check-label" for="criminalNo">No</label>
</div>
</div>
<div class="form-group">
<label>Have you ever been evicted, asked to leave, or paid rent late? <code>*</code></label>
<br>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="yes" required>Yes</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="evicted" value="no" required> No</label>
</div>
</div>
<div class="form-group">
<label for="adultCount">How many adults (18+) will be living in this rental? <code>*</code></label>
<select class="form-control" id="adultCount" name="adultCount" required>
<option value="">Select number of adults</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10 or more</option>
</select>
<small class="form-text text-muted">A separate showing request must be completed by every adult that
will be living in the home.</small>
</div>
<div class="form-group">
<label for="childCount">How many minors (under 18) will be living in this
rental? <code>*</code></label>
<select class="form-control" id="childCount" name="childCount" required>
<option value="">Select number of minors</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10 or more</option>
</select>
</div>
<div class="form-group">
<label>Tell us about your pets</label>
<table class="table table-responsive table-condensed">
<thead data-ng-show="vm.showingRequest.pets.length">
<tr>
<th>#</th>
<th>Type</th>
<th>Breed</th>
<th>Name</th>
<th>Age</th>
<th>Color</th>
<th>Weight</th>
<th>Gender</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td><input type="text" id="petOneType" name="petOneType" class="form-control"
placeholder="Dog, Cat, Bird, etc"/></td>
<td><input type="text" id="petOneBreed" name="petOneBreed" class="form-control"
placeholder="Breed of the pet"/></td>
<td><input type="text" id="petOneName" name="petOneName" class="form-control"
placeholder="Name of the pet"/></td>
<td><input type="number" id="petOneAge" name="petOneAge" class="form-control"
placeholder="Age in years"/></td>
<td><input type="text" id="petOneColor" name="petOneColor" class="form-control"
placeholder="Color"/></td>
<td><input type="number" id="petOneWeight" name="petOneWeight" class="form-control"
placeholder="Pounds"/></td>
<td><select class="form-control" id="petOneGender" name="petOneGender">
<option value="">Select gender of pet</option>
<option value="female">Female</option>
<option value="male">Male</option>
</select></td>
</tr>
<tr>
<th scope="row">2</th>
<td><input type="text" id="petTwoType" name="petTwoType" class="form-control"
placeholder="Dog, Cat, Bird, etc"/></td>
<td><input type="text" id="petTwoBreed" name="petTwoBreed" class="form-control"
placeholder="Breed of the pet"/></td>
<td><input type="text" id="petTwoName" name="petTwoName" class="form-control"
placeholder="Name of the pet"/></td>
<td><input type="number" id="petTwoAge" name="petTwoAge" class="form-control"
placeholder="Age in years"/></td>
<td><input type="text" id="petTwoColor" name="petTwoColor" class="form-control"
placeholder="Color"/></td>
<td><input type="number" id="petTwoWeight" name="petTwoWeight" class="form-control"
placeholder="Pounds"/></td>
<td><select class="form-control" id="petTwoGender" name="petTwoGender">
<option value="">Select gender of pet</option>
<option value="female">Female</option>
<option value="male">Male</option>
</select></td>
</tr>
</tbody>
</table>
</div>
<div class="form-group">
<label for="features">Are there any particular features or amenities you want to have in
your next home?</label>
<textarea id="features" name="features" class="form-control" maxlength="255"
placeholder="Washer & Drier, dishwasher, off-street parking, garage, etc."></textarea>
</div>
<div class="form-group">
<label for="pastRentals">How many places have you rented in the past? <code>*</code></label>
<select class="form-control" id="pastRentals" name="pastRentals" required>
<option value="">Select number of past rentals</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10 or more</option>
</select>
<small class="form-text text-muted">Include your current home if it is a rental.</small>
</div>
<div class="form-group">
<label for="currentAddress">What is your current address? <code>*</code></label>
<input type="text" id="currentAddress" name="currentAddress" class="form-control"
placeholder="Current address" required maxlength="140">
</div>
<div class="form-group">
<label for="currentAddressMoveIn">When did you move into your current address?
<code>*</code></label>
<input type="date" name="currentAddressMoveIn" id="currentAddressMoveIn"
class="form-control" required/>
</div>
<div class="form-group">
<label class="control-label" for="currentRent">How much monthly rent are you paying now?
<code>*</code></label>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">$</span>
</div>
<input type="number" id="currentRent" name="currentRent" class="form-control"
aria-label="Current rent (to the nearest dollar)">
<div class="input-group-append">
<span class="input-group-text">.00</span>
</div>
</div>
</div>
<div class="form-group">
<label for="management">How is the management at your current address?</label>
<textarea id="management" name="management" class="form-control"
placeholder="Tell us about your current property manager"
rows="4"></textarea>
</div>
<div class="form-group">
<label for="problems">Have you experienced any problems at your current address?</label>
<textarea id="problems" name="problems" class="form-control" rows="4"
placeholder="Plugged drains or toilets, insects or other pets, maintenance issues, etc."></textarea>
</div>
<div class="form-group">
<label for="reasonForMoving">Why are you moving?</label>
<textarea id="reasonForMoving" name="reasonForMoving" class="form-control" rows="4"
placeholder="Tell us why you are moving"></textarea>
</div>
<div class="form-group">
<label for="anythingElse">Is there anything else we should know about you?</label>
<textarea id="anythingElse" name="anythingElse" class="form-control"
placeholder="Tell us a little more about yourself" rows="4"></textarea>
</div>
<div class="form-group">
<label for="otherAdults">What are the names of the other adults that will be living in the
home?</label>
<textarea id="otherAdults" name="otherAdults" class="form-control"
placeholder="Tell us the names of the other adults that will be living with you."
rows="2"></textarea>
<small class="form-text text-muted">This helps us link together the showing requests for
each adult.</small>
</div>
<div class="form-group">
<label class="control-label" for="referral">How did you hear about this rental?</label>
<input name="referral" type="text" id="referral" maxlength="140" class="form-control"
placeholder="Zillow, Trulia, CraigsList, Friend, etc.">
</div>
<div class="form-group">
<label>Terms and Conditions <code>*</code></label>
<br>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="agreeToTerms" name="agreeToTerms"
required>
<label class="form-check-label" for="agreeToTerms">
I certify the above information is true and complete to the best of my
knowledge and understand that any false, incomplete, or misleading information may
be grounds for rejection of this showing request or termination of any future lease
or rental agreement.
</label>
</div>
</div>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Submit</button>
</fieldset>
</form>
fool
June 23, 2020, 10:39pm
9
Would be great if you could link us to the deployed form live (or at least tell us the form name plus the site ID it is on - you can find that on the general settings page for the site and it is safe to share publicly), so we can check it out in context - some things about how we handle form submissions depend on the settings in the database generated at deploy time.
Frankly it has been so slow and such a pain to get support for this that I gave up trying to correct it in the email.
I use Zapier to add the form data to a Google spreadsheet and, as a result, I avoid the problem entirely.
The form is no longer on my site since I no longer have any vacant rentals.
perry
September 7, 2020, 7:18pm
11
hey dale! sorry to hear that you didn’t get the help you were hoping for - as per above we were happy to keep troubleshooting this but it we didn’t get a reply since june.
One of our solutions might have been to suggest zapier - i’m not gonna lie that our forms can be tricky to work with in less out-of-the-box situations - definitely hoping to see some improvement there in the future.
For now i’m just glad you found a solution that works for your use case and you shared it here so others can consider it!
I think the forms are working just fine, even in less out-of-the-box situations. The problem, IMO, is the fancy parcing of the HTML to send a more human readable email.
I don’t care about human readability but the support responses were focused on the email and not the data so I gave up.
I should have been more specific about what I was asking. I imagine most requests about forms are related to the human readability of the email.
