textarea html5 validation with minimum number of characters - html

I've created a form with below textarea, however when i try to do a simple validation with pattern, title and required it does not seem to work. it show the small pop up window if the textarea is empty, but it does not show it with the title if below 30 charachters? do this not work on textarea or what am i doing wrong?
<textarea name="textarea" id="description" value="" placeholder="Beskrivelse" required="required" pattern=".{30,}" title="30 characters minimum"></textarea>

Have you taken a look at the attribute minlength? As of setting the attribut minlength="30" to the textarea.
<textarea name="textarea" id="description" value="" placeholder="Beskrivelse" required="required" minlength="30" title="30 characters minimum"></textarea>

Related

How do i prepopulate textarea with data from database (or any text for that matter) in ASP.Net?

Ok, so basically i have an form which edits data in my database. I have the following inputs:
<input value="#title" type="text" asp-for="#Model.ProjName" class="form-control" placeholder="Ticket1" />
<textarea value="#description" type="text" asp-for="#Model.ProjDescription" class="form-control" rows="3"></textarea>
I can pre-populate the input just fine, however value doesn't work on the textarea. What is the correct way of populating it?
This will solve your problem. Text area acts differently from input tag . So instead of using value parameter, add your value between open and close tag of text area
<textarea type="text" asp-for="#Model.ProjDescription" class="form-control" rows="3">#Model.description</textarea>
Here is a .net fiddle with an example
https://dotnetfiddle.net/2TYEOk
Since you use asp-for="#Model.ProjDescription",so the default value will be #Model.ProjDescription,if you want to bind value with #description,you can try to use id and name to replace asp-for="#Model.ProjDescription".Here is the sample code:
<textarea type="text" id="ProjDescription" name="ProjDescription" class="form-control" rows="3" >#description</textarea>

How to disable input recommendations?

I'm trying to prevent recommendations from coming up on an input box I created.
<input type="text" class="form-control" name="message" id="msg"
placeholder="Type a message" autocomplete="false">
But even with autocomplete="false" I still get the following:
I don't want the recommendations to show up on the input box.
I believe you should try using "off" instead of "false".
autocomplete="off"
In context to your given scenario, try the following code snippet
<input type="text" class="form-control" name="message" id="msg"
placeholder="Type a message" autocomplete="off">
If your inputs are wrapped up in a <form> you can use this attribute on the form instead of each individual <input>.
It tells the browser not to save data inputted by the user for later autocompletion on similar forms, though heuristics for complying vary by browser.
Here is the reference.

How to restrict text box length in HTML using Angular JS

I want to restrict my Comments text box within 40 characters. I have used max=40.Its not working. Anyone please help me to fix this issue
Code:
<label for="cmds">Comments</label>
<input type="text" max="40" class="form-control" id="cmds" name="cmds"
data-ng-model="Audit.cmds" placeholder="null" >
Since you are dealing with comments, its better to use textarea instead of input type="text".
By using textarea you can do:
<textarea maxlength="40" id="comments" cols="" rows="">
Demo: https://jsfiddle.net/akshaymhatre89/L8fky10q/4/
<label for="cmds">Comments</label>
<input type="text" ̶m̶a̶x̶=̶"̶4̶0̶"̶ class="form-control" id="cmds" name="cmds"
data-ng-model="Audit.cmds" placeholder="null"
ng-maxlength="40" />
For more information, see AngularJS ng-maxlength Directive API Reference.

textarea is Filled with White Spaces

First off, I'm using Shopify. I have a textarea and it is filled with white spaces when the page loads. I know why, it's because of the HTML, but I don't know why the browser is served different HTML than the HTML I created.
Here is my code:
<textarea name="contact[body]" id="ContactFormMessage" placeholder="Your message...."></textarea>
And this is what is served to the browser:
<textarea rows="10"
name="contact[body]"
id="ContactFormMessage"
placeholder="Your message">
</textarea>
Anyone know what's going on?
you have empty space between beginning textarea tag and closing tag. you need to remove that.
<textarea rows="10"
name="contact[body]"
id="ContactFormMessage"
placeholder="Your message"></textarea>
You have no value in your textarea block. If you wanted the textarea to be initialized with "foo", you would do
<textarea name="contact[body]" id="ContactFormMessage" placeholder="Your message">foo</textarea>
As an aside, the square brace is not a valid character for the name attribute. (See https://www.w3.org/TR/html401/types.html#h-6.2)

How do I keep <textarea> from displaying raw html?

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>