Please provide feedback on my survey form, and question about it

Please take a moment to take a look at my survey form: https://codepen.io/pjmofperk/pen/Garbpe

Please tell me how I get rid of the text in the textarea!"

Thank you in advance for your feedback.

Patrick

2 Likes

Very cool project!
I tried this and it worked (Using Chrome)! :vulcan_salute:

</textarea> 

Also need submit button for text area!

1 Like

@pjmofperk, you have a lot of typo’s. codepen provides you with a validator for HTML, CSS and JS. Click on the arrow in the upper right of each section and then click on the respective ‘Analyze’ link.

  • You are missing the closing angle bracket on some and missing closing element tags on others.
  • Your code only passes 1/17 of the tests

I’m guessing you’re not done with this yet since there’s no submit button.

As an aside, codepen expects just the code that you’d put between the <body> </body> tags. If you need to add anything to the head then click on the Settings button and follow instructions.

2 Likes

Thank you all for the feedback.

1 Like

Missing an s here: Congratulation(s)

Also, seeing code in your textbox at the bottom:

1 Like

Thank you for your feedback. I can’t figure out how to get that code out of that textbox at the bottom. I’m hoping for some advice on that.

1 Like

@pjmofperk, once again, using the validator helps. It’s giving you the following errors;

  • ‘<’ is not a valid attribute of the <textarea>element.
  • ‘textarea’ is not a valid attribute of the <textarea> element.

If you look at your code for textarea you have;
<textarea id="tell" rows="10" cols="100" </textarea>

Now to play everyone’s favorite game, spot the typo. In this case, spot where you’re missing this; >

2 Likes

Yeah I played with your codepen a little and couldn’t get it to disappear either. Wanted to bring it up and hopefully someone with more knowledge will see the issue.

To me it looks like your final major div isn’t closed?

But when I added a closing tag it didn't resolve the issue.

I noticed a couple more errors going through the code more closely. You should put " " around classes and ID’s, you’re missing the closing > for the label in the STATE section which invalidates the rest of your code. You need a closing strong tag and you have an extra " before placeholder. See the second version for the fixes I implemented.

You were missing a > for the textarea to close it. Have a look at my image and let me know if you need more help. I also added syntax for a button.

1 Like

ha Roma was a faster typist than I.

1 Like

Adding the > to the end of the textarea did it. ><./textarea>
Thank you for the input. I got my HTML cleaning up a bit. I didn’t know about that feature in CodePen. I’ve still got lots to learn.

The instruction I read online did not include the extra >

1 Like

It’s not extra. Every valid HTML tag starts with a < and ends with a >

1 Like

Don’t forget to repost when you’ve finished cleaning and styling so we can see the finished page.

@pjmofperk
I suggest centering the fields so they will always be in the middle.
Here is how it is looking at 650px width:

it would look nice and clean if you were to make all the text input boxes aligned vertically. You should be able to implement this into a table

Here it is, all cleaned up: https://codepen.io/pjmofperk/pen/Garbpe

@pjmofperk, it’s looking better but there’s still work to be done.

Include this in your HTML;
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
This will give the hamburger that has the user story requirements for this survey form (and the other responsive projects that you’ll do). Right now your form is meeting only one of the user stories.
When you run it, if any tests are failing the Tests button will be red. You can click on that button and it will give details about why the test is failing.
Have fun!

Nice job! there are a few things that you could fix: 1. the submit button won’t submit.
2. make the survey about something, like a checkout form or one about what a user’s favorite thing is. not just filling out your name and stuff.
3. this is a bit too yellow and maybe needs a better background or a better font.