I have this old website which uses Javascript for validation. It works. But now, I need to change the site to Bootstrap which is in HTML5. I would like to know if Javascript is needed to validate if the textboxes are empty and if empty, then there will be an error message that says"Please enter your Name" when the user hits empty.
<div class="control-group form-group">
<div class="controls">
<label>Full Name:</label> <input type="text" class="form-control"
id="txtFullName" name="txtFullName" required name="name"
data-validation-required-message="Please enter your name.">
I have this data-validatation-required-message but it is just not working - as in the message doesn’t show up when the field is left blank.
So, I hope someone can point me the right direction how things are being done for checking empty fields in bootstrap layout website.
If you want to use HTML5 validation, you can use the required attribute. Modern browsers should show validation messages when the containing form is submitted, so you need something like this:
<form action="#">
<label for="name">Please enter your name.
<input id="name" required>
</label>
<button type="submit">Submit</button>
</form>
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.
See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.
Based on the code you posted, I can’t see a containing form or a button/input with type="submit". You’ll need both, and the user needs to click the submit button before the message shows up.
I think I may have misunderstood the question. Are you using jqBootstrapValidation? If so, it looks like that requires both jQuery and Bootstrap.
So the answer is: if you want to use pure HTML5 validation, you don’t need JavaScript (or even any custom CSS). However, if you want the specific validation functionality of jqBootstrapValidation, you’ll need to use JavaScript, and I’d recommend starting from the examples in the documentation.
I have examined the bootstrap template that bundled with the library which included jqBootstrapValidation. However, when I left a blank and submit the form, it doesn’t show any error message. Is there anything I have missed out ?
Can I check whether the validation error will appear before the form is submitted should a user forgot to fill in one of the form fields?
I checked with my boss and I need to hide the domain name. Thus, I googled and found that may have to upload the code to heroku. Not sure if I can leave out the database and the server code and you can advise me from there.
Have you read the documentation I linked to? It has a live demo right up the top that demonstrates the intended behavior very clearly, alongside its source code.
