i'm adding a login system to my website i've figured out how to change pages but even if my login fields are empty when i click on my login button it changes page like i'm logged in while i'm not. Before adding the a href='index.html' when i was clicking the login button the site told me that i needed to fill the login field but now when i click even if the field are empty there's no error message and it changes page.
sorry if my explanations are a bit messy if you need more infos tell me ! :)
here's my code :
<form>
<input type="email" class="input-box" placeholder="Email" required>
<input type="password" class="input-box" placeholder="Password" required>
<button type="submit" class="submit-btn">Login</button>
<input type="checkbox"><span>remember me</span>
</form>
You can use several options to fix your problem.
As some others already suggested you can use JavaScript to validate the content of your input field. This is only on the client and wil leave your server still vulnerable to attacks. You should do a server validation too, with PHP for example and to be 100% safe a constraint validation for the database.
You could simple set constraint inside the HTML Tags:
(min-length, max-length, pattern(RegEx))
and so on.
Check the W3Schools site for more detailed information.
I would still use the aditional option from 1) to be safe!
Related
How do I prevent a form from suggesting auto-complete values, from previous entries or from saved information in Edge?
In the above image, the email input field is marked as autocomplete="false", but still in the right pane you can see the suggestion is populating.
When I add autocomplete=disabled to one field it seems it work, but when I add the attribute to all the inputs, it again starts displaying suggestions for every field.
What is the solution for this?
Add the aria-autocomplete="list" attribute to the input.
<input type="text" id="FirstName" name="attr1" aria-autocomplete="list">
Do not use any other value for the attribute.
According to your description, I reproduced the problem. I think your issue is caused by the "Save and fill personal info" setting being enabled in Edge.
If you navigate to edge://settings/personalinfo and disable this feature, you can see this behavior no longer exists.
Or you can also click the "Manage personal info" option in the picture you provided, and then disable it.
I did some simple tests and found that if you need to solve the problem from the code, you need to modify the name attribute of the form's related field.
Like this（do not use attribute values like name or email... and maybe there are others I am not aware of):
<label for="attr1">attr1:</label>
<input type="text" id="FirstName" name="attr1">
<label for="attr2">attr2 :</label>
<input type="text" id="LastName" name="attr2">
<label for="attr3">attr3 :</label>
<input type="email" id="Email" name="attr3" autocomplete="off">
<input type="submit">
I don't recommend this, because good naming helps you understand and maintain the code. Using proper attributes like name and email also helps your code be more accessible for screen readers or other assistive technology.
I am trying to figure out if there is a way to use GMAIL in an HTML contact form without a backend, like formspree ie. Does GMAIL give an API key for this purpose?
I made a little Heroku app for doing this, it requires no login and completely free without any asterisks. Best for static sites!
Requirements:
All inputs must have a name property,
The action property must be "http://form-delivr.herokuapp.com/handler/yourEmailAddress",
The method property must be post,
If anyone submits the form, the data will be mailed back to the email address you provided in the action property!
Example:
<form action="http://form-delivr.herokuapp.com/handler/tony#mail.com" method="post">
<h4>Username:</h4>
<input name="username">
<h4>Email:</h4>
<input type="email", name="email">
<button type="submit">Submit</button>
</form>
Note: I will be changing on this so stay tuned or your form may stop working suddenly if you use this :(
I need to debug missing data in some from POSTed to the server and after reading lots of tutorials and following other examples about that aspect, I still can't find my problem. The use case is pretty simple in theory: Have one form with two submit buttons to trigger different implementation on the server side.
According to lots of tutorials and examples, the submit-buttons should send their name if they have a name-attribute, while values should not be sent at all. The naming thing seems to differ according server side programming languages, sometimes it's some_name and sometimes some_name[], but that doesn't make any difference for me currently.
My problem is that whatever HTML I create, inputs of type submit are never part of the POSTed data. OTOH, pretty much the same HTML as button works as expected: If the button is used to submit the form, its name and even value are part of the POSTed data. When other inputs are clicked to submit, no names of any submit-input are available in the data.
So, with the exact same form, reaching the exact same endpoint, using same browser etc., the following DOES NOT provide any hint to the clicked button in the POSTed data:
<input type="submit"
name="foobar input"
value="foobar input"
title="foobar input"
/>
While the following OTOH does:
<button type="submit"
name="foobar button"
value="foobar button"
title="foobar button">
foobar button
</button>
So, should the input work the same way like the button does in theory? Or is the HTML wrong and I'm not able to spot the error? Sending the form itself works in both cases, though. So the browser obviously knows about the submit-input and its purpose.
Or have something changed the last years in modern browsers and submit-inputs are not part of POSTed data at all anymore for some reason? I can't remember the need to have multiple submits on a form for years.
How does a minimal example using a submit-input sending its name look like and tested to work for you? And in which browser? I tested an up-to-date Chromium based Opera and IE 11 and neither did include submit names.
Thanks!
OPINION: I would personally NEVER use more than one word in the name of a submit button
FACT: If that word is "submit" or you have id="submit" then you will not be able to programmatically submit the form using .submit()
FACT if you have script that disables the form element, it will not be sent to the server
Conclusion
In my experience and according to documentation - If you have the following
<form>
...................
<button type="submit"
name="whatever you want here but I would only use one name and NOT submit">Whatever</button>
</form>
OR
<form>
...................
<input type="submit"
name="whatever you want here but I would only use one name and NOT submit" value"Whatever">
</form>
your server will receive the button as name=value in the POST array if method = post and in the GET if nothing or method=get AND in the REQUEST array in either case (assuming PHP)
TEST PAGE
<form method="post" action="testsubmit.php">
Did not work according to OP<br/>
But it actually DOES work if not disabled from elsewhere <br/>
<input type="submit"
name="foobar input"
value="foobar input"
title="foobar input"
/>
<hr/>
<input type="text" name="sentField" value="This WILL be sent to the server" style="width:300px"/>
<hr/>
<input type="text" name="disField" disabled value="This will NOT be sent to the server" style="width:300px"/>
<hr/>
Does work
<button type="submit"
name="foobar button"
value="foobar button"
title="foobar button">
foobar button
</button>
</form>
this is my jsp page
<html>
<body>
<span>User name:</span> <input type="text" name="Teachername" value="<%=request.getParameter("name") %>" class="input_panel" id="Username" readonly/><br><br><br>
<span>Old password:</span> <input type="password" name="TeacherOpwd" class="input_panel" id="TeacherOpwd" /><br><br><br>
<span>New password:</span> <input type="password" name="TeacherNpwd" class="input_panel" id="TeacherNpwd" /><br><br><br>
<input type="submit" id="TeacherSubmit" name="submit" class="submit_button" value=" " />
</body></html>
i need, whatever i write on the textbox remain unchanged after refreshing the page.
please help..
You can't. That's not how HTML/JSP works. If you want to do something like this you should look at implementing some form of MVVM pattern, or using a framework which supports it. (ZK, AngularJS or KnockoutJS).
For more information, read the Wikipedia article on MVVM
For your requirement, data must be preserved for later availability after refresh.
So, as and when you write, there must be some way which is doing the work of storing in background, so that when refresh happens, it can take the data from stored place.
I have not found requirement like this before but can think like you can go with Ajax for this and once you get the data at server, try storing it in cookie and when refresh happens, first try to read from cookie if available or else show blank.
Also, check is there any way you can store it at javascript level, as I am not aware of that.
use HttpSession session = request.getSession(); session.setAttribute("someItem")
after you click the button. It should still be there.
I was looking for a fix to stop IE refreshing the page instead of submitting my single line form, when a user hits enter instead of clicking go.
I found this solution, which works well, but I was wondering if anyone could explain why it works?
The solution I used is to add a hidden text input within the form tags, like this
`<form name="SearchForm" id="SearchForm" method="get" action="">
/*This is the hidden text input*/
<input type="text" style="visibility:hidden;display:none;" name="ieSearchEnter">
</input>
<fieldset>
<span><input type="text" name="Search" id="Search"/></span>
<div class="field actions">
<input type="submit" name="Go" id="Go" class="submit" value="Go"/>
</div>
</fieldset>
</form>`
which i found here.
Thanks!
Are you really setting the ACTION value to an empty string, or did you just do that for your code sample?
I don't think IE is really "refreshing the page"-- I think it's automatically submitting your form.
Here's a simple test page: http://www.enhanceie.com/sandbox/simpleform.asp. When you hit enter, you'll see that the URL is updated to pass the user's value.
IIRC, there is code in IE's form-handling that says that if you have form containing a single test field, then hitting ENTER will submit that form. In your workaround, you've added an additional text field so that optimization is not applied.
I think maybe your server-side code is REQUIRING that the form submission contains "Go=Go" or it ignores the submitted value (Search=Whatevertheuserhadtyped) and simply re-displays the form. If you change the server-side script such that it does not require Go=Go, then your problem should go away.