I have a basic Ruby/Sinatra app with a form that doesn't seem to be working quite right. The form has two inputs, a text box and a textarea. When I inspect the params that should be passed back to the app by the form, I only see the input from the text box, but not the textarea. My code is below:
In app.rb
post '/create' do
params.inspect
end
In new.erb
<h1>Add New Page</h1>
<div>
<form method="post" action="/create">
<fieldset>
<label for="title">Title:</label>
<input type="text" name="title" id="title">
</fieldset>
<fieldset>
<label for="content">Content:</label>
<textarea rows="10" columns="50" id="content"></textarea>
</fieldset>
<input type="submit">
</form>
</div>
Back to Index
When I navigate to http://localhost:4567/create it only returns:
{"title"=>"asdf"}
But there should also be some sort of information returned for the textarea input as well!
Turns out the Sinatra params hash in Sinatra looks for the name attribute in input tags. Found that information at https://learn.co/lessons/sinatra-forms-params-readme-walkthrough
The correct declaration for the text area box should've been like this:
<fieldset>
<label for="content">Content:</label>
<textarea rows="10" columns="50" name="content" id="content"></textarea>
</fieldset>
Related
I have an HTML form, which consists of few divs, and there are label and input inside every div.
So for name and email inputs I want to add "required" property. But when I set it and then submit the form, I instantly start running the form action, even if my inputs were empty. So that's first time I face with such a trouble. It's also the first time when I put divs inside the form, but it seems like it should work anyway.
So you can see my code below:
<section>
<form id="feedback_form" method="POST" action="{% url 'feedback' %}">
<div class="field half first">
<label for="name">Name*</label>
<input type="text" name="name" id="name" required/>
</div>
<div class="field half">
<label for="email">Email*</label>
<input type="email" name="email" id="email" required/>
</div>
<div class="field">
<label for="message">Message</label>
<textarea name="message" id="message" rows="5"></textarea>
</div>
<button class="button submit" type="submit">Send</button>
</form>
</section>
So I solved this. It was an issue with some implicit javascript code on page (I usually work with backend, so haven't made this page by myself before).
So in .js file I found such part of script which disallowed submitting form in a standard way.
$('form').on('click', '.submit', function(event) {
event.stopPropagation();
event.preventDefault();
$(this).parents('form').submit();
});
So my advice: if you work with code written by others, do some more research and check files few times if you can't solve some implicit tasks.
I'm using this HTML code in an HTML page:
<form method="post">
<div class="form-group">
<input type="text" class="form-control" name="username">
</div>
<div class="form-group">
<input type="password" class="form-control" name="password">
</div>
<input type="hidden" name="ref" value="post-ad.php"/>
<button type="submit" name="submit" id="submit" class="btn">S'identifier</button>
</form>
On clicking submit button which action will this form execute? I noticed that it execute the value of input named "ref" in this example "post-ad.php" or "index.php" or "dashboard.php". Is it normal?! As I know the action attribute is mandatory?
without action attribute it will POST/GET to the same page
see here
If I understood right you're asking about action attribute that goes inside <form>.
If you put nothing there, it'll send the POST to the same page it is right now. If that form is in "index.php" it'll send all <form> data to "index.php"
You call form without action with this code:
<form action="javascript:void(0);"></form>
I am no expert in coding. As a matter of a fact this is my first true project in CSS. I created the page in Adobe Edge Reflow and exported CSS to dreamweaver. The problem I am running into is that I can't get my form to actually work. I want the form to send directly to my e-mail, in no specific format. Can anyone help me out?
<form method="post" novalidate>
<label id="formgroup">
<p id="text1">
Name*
</p>
<input id="textinput" type="text" value=" Your Name"></input>
</label>
<label id="formgroup1">
<p id="text2">
Company Name
</p>
<input id="textinput1" type="text" value=" Company Name"></input>
</label>
<label id="formgroup2">
<p id="text3">
Email*
</p>
<input id="textinput2" type="text" value=" email"></input>
</label>
<label id="formgroup3">
<p id="text4">
Message*
</p>
<input id="textinput3" type="text" value=" Your message"></input>
</label>
<input id="submit" type="submit" value="Send Message"></input>
<input type="hidden" name="recipient" value="xxx#gmail.com"> </form>
Your HTML markup seems fine for a simple form aimed to post the contents of a range of fields.
However, the HTML code (along with any CSS) will only enable you to determine the presentation/style of the form (i.e. how it looks).
Regarding the functionality of the application actually triggering an email with the form contents to an email address, this will require more code in a 'server-side' language such as PHP (HTML and CSS being 'client-side' languages).
Here is a good article that provides a tutorial on the subject: http://www.html-form-guide.com/php-form/php-form-tutorial.html
Your HTML markup is actually missing something, the "action" property, i.e.
Before:
<form method="post" novalidate>
After:
<form method="post" novalidate action="send-email.php">
As you might have guessed from looking at the above, this "action" property specifies the PHP script/file that triggers the email. And of course it is this file that you are currently missing.
Hope this helps.
I am learning how to make forms and made this for practice. When I have labels out it and try to click into any of the form elements, it selects the previous one. For example, if I click into the password input box, it sends me to the username input box. When I remove the labels the bug goes away. I'm pretty sure labels aren't supposed to do this. The console isn't showing any errors so I'm confused to why this is acting up.
Here is my code:
<form action="">
<fieldset>
<label>username<label>
<input type="text" id="userInput"/>
<label>password<label>
<input type="password" id="passwordInput"/>
<label>Hidden<label>
<input type="hidden" id="hiddenInput" value="I can't tell you"/>
<label>Text Area<label>
<textArea id="areaInput" rows="10" cols="40">
This is a big area with lots of text.
</textArea>
<input type="button" onClick="" value="submit"/>
<fieldset>
<form>
Looks like you are not closing your label tags, so you are making another label. You need to close the <label> by using </label> - just a typo!
You're not closing out your <label> tag. Use the / slash on the closing tag:
<label>username</label>
I'm working on the comment leaving system on my blog and everything works fine except I can't get my "comments" text box to become larger. Well, I can, using the command, but it puts the raw html from the rest of the page in the text box. The page displays my form as "Name: [blank input box] Comment: [larger input box, but filled with all the html on the page that follows ]". Here's my HTML form:
<div id="form">
<form action="comments.php" method="post">
<label for="name">Name</label>
<input id="name" name="name" type="text" />
<label for="comment">Comment</label>
<textarea name="comment" cols=40 rows=6></textarea><br><br>
<input type="Submit" value="Post Comment" />
</form>
</div>
What can I do to keep the 40 cols and 6 rows sized input box but stop it from displaying all the raw html that follows it in the input field?
There's nothing wrong with that HTML. Are you sure there isn't anything else on the page?
One thing to change: make sure you have cols="40" rows="6" (use quote marks around all attribute values).
You might also consider using a style instead:
<textarea name="comment" style="width: 400px; height: 100px;"></textarea>
Put all of your attributes inside of quotes:
<textarea name="comment" cols="40" rows="6"></textarea><br><br>