Firefox bug with input type password? - firefox

I have a problem in an application I'm developing, if I have input fields with type 'password' then another input field is populated with data from a completely different element.
If I set the type of the element that is 'password' to 'text' there is no problem.
Unforunatley I can't post an example of jsFiddle, but I've searched around and found other people having a problem with Firefox with an older version.
I'm using version: 43.0b9 with Firebug 2.0.13
IE, Chrome and Safari do not do this with the exact same page loaded, but its very repeatable and very realiable in FireFox.
I've set the attribute autocomplete="off" but no difference.
This problem has me scratching my head...I've commented out just about everything, but the problem still occurs, some how my name and login password are finding there way into two INPUT elements, the same page in Chrome, IE and Safari does not do this.

I was having the same problem, and finally solved it after reading this answer to other similar question: https://stackoverflow.com/a/10745884/6938721
In my case, I had a lot of input fields divided into multiple fieldsets, and sent them through AJAX.
Well, the solution was to surround each <fieldset>...</fieldset> with <form>...</form> labels.
Originally I had something like:
<fieldset>
<input type="text" name="field1">
<input type="password" name="field2">
<input type="password" name="field3">
</fieldset>
<fieldset>
<input type="text" name="field4">
<input type="password" name="field5">
<input type="password" name="field6">
</fieldset>
And after applying the solution I get:
<form>
<fieldset>
<input type="text" name="field1">
<input type="password" name="field2">
<input type="password" name="field3">
</fieldset>
</form>
<form>
<fieldset>
<input type="text" name="field4">
<input type="password" name="field5">
<input type="password" name="field6">
</fieldset>
</form>
Edit:
The key is to not have more than 3 password inputs inside a <form> block. The document works as a <form> block by itself
Hope this helps

Related

Avoiding field prepopulation in a thymeleaf form with Spring-Boot

I am having a trouble getting rid of the field prepopulation in a thymeleaf form and displaying text placeholders instead.
Here is the snippet of the form:
<form action="#" th:action="#{/catch/save}" th:object="${catch}" method="post">
<input type="hidden" th:field="*{id}">
<input type="text" th:field="*{species}" th:placeholder="Species"
class="form-control mb-4 col-3">
<input type="text" th:field="*{length}" th:placeholder="Length"
class="form-control mb-4 col-3">
<input type="text" th:field="*{weigth}" th:placeholder="Weigth"
class="form-control mb-4 col-3">
and here is the image of the resulting form:
Prepopulated form
My goal is to have the two fields prepopulated with "Length" and "Weigth". These fields correspond to int and double object fields, so if I understand correctly they are initiated with 0 when the bean is created and therefore so are th:fields when the form is loaded.
Could you help me find a way to solve this?
Thank you in advance

Changing a text file from a HTML form

I'm just wondering if there's any way I can change the data held in my text file by filling out a HTML form on my website.
I've used AJAX to read to the website before but I don't know if its possible the other way round..
Ok so I don't really have any code yet cause I'm not sure how to do it.. but essentially, I want this HTML form:
<form name="updateGallery">
<b>Image:</b> <input type="image" name="image"/><br>
<b>Name:</b> <input type="text" name="name"/><br>
<b>Description and Price:</b> <input type="text" name="desPrice"/><br><br>
<input id="start" type="submit" onclick="submit" value="Update"/>
<input id="start" type="reset" value="Cancel"/>
</form>
to read to a text file I have set up containing information on items including - the name, an image of the item, description and price.

How to properly internationalize a Sinatra page?

I have a Sinatra route file, which displays some page.
<h2>Free, open song contest</h2>
<h3>Sign up</h3>
<form action="/signup" method="post">
E-mail: <input type="text" name="email" placeholder="Your e-mail"><br/>
Password: <input type="password" name="password"><br/>
Repeat password: <input type="password" name="password2"><br/>
Account type: <input type="radio" checked="true" name="type" value="fan">Fan
<input type="radio" name="type" value="musician">Musician
</form>
<h3>Log in</h3>
<form action="/login" method="post">
E-mail: <input type="text" name="email" placeholder="Your e-mail"><br/>
Password: <input type="password" name="password"><br/>
</form>
If I wanted to internationalize all string in this page (Free, open song contest, Sign up, E-mail etc.), what is the correct way to do this?
I found this i18n recipe, but it doesn't tell, how to insert the internationalized strings into the template (home.erb in the above example).
In the same documentation page, it later says:
Selection of localized strings/objects is easy as it only requires use
of standard methods from I18n
I18n.t(:token)
I18n.l(Time.now)
So, you need to do:
<h2>I18n.t(:contest_page_title')</h2>
And, in your locales/en.yml, you will have:
en:
contest_page_title: Free, open song contest
Since the i18n gem is also used in Rails, basic aspects of internationalization can also be inferred from Rails guide

Honeypot protection with Ajax

Recently i got attacked by nasty auto-form fill bots which filled my shout form with all sorts of spam. My shout form consist from a html file with 2 textboxes,an ajax script(for refreshing without reloading) and my php file for handling all the inserting data into my DB.
I am thinking implementing a hidden textbox for a minimum protection against these bots but with no luck since i cant pass the honeypot data to my php file. My code:
HTML Form
<form class="form" method="post" action="postdata.php">
<fieldset id="inputs">
<input id="name" name="name" type="text" placeholder="name" maxlength="20">
<textarea id="message" name="message" type="text" placeholder="message" maxlength="255"></textarea>
</fieldset>
<fieldset id="actions">
<input type="submit" id="submit" value="Submit">
</fieldset>
</form>
Ajax script
$(function(){refresh_shoutbox();$("#submit").click(function(){var a=$("#name").val();var b=$("#message").val();var c="name="+a+"&message="+b;$.ajax({type:"POST",url:"postdata.php",data:c,success:function(d){$("#shout").html(d);$("#message").val("");$("#name").val("")}});return false})});
function refresh_shoutbox(){var a="refresh=1";$.ajax({type:"POST",headers:{"cache-control":"no-cache"},url:"postdata.php",data:a,success:function(b){$("#shout").html(b)}})};
postdata.php file
<?php
if($_POST['name'] or $_POST['message']) {
$name= $_POST['name'];
$message= $_POST['message'];
///do other stuff/////
?>
I will insert a hidden field in my html form
<input id="email" name="emails" style="display:none"></br>
but i cant manage to pass the extra value to my existing ajax script.Tried some code but with no luck.
Any help so i can get my shoutbox up and running again?

Multiple password forms + password completion

On a website I'm working we have an onsite login and a private login, the problem I'm having is that Firefox doesn't seem to be able to differentiate between these login forms.
Does anybody know how I can make clear that these are different logins?
I already tried giving the form fields different names and ids, ex: onsite_login and login but without success.
edit: my form-tags are not being mixed up, they aren't even on the same page
The two forms on the different pages
<form method="post" action="/en/login/1">
<fieldset>
<p>
<input type="hidden" value="login" name="form"/>
<input type="hidden" value="en" name="redirect"/>
<label for="onsite_username">Username<abbr title="Required ">*</abbr></label>
<input type="text" class="input-text" maxlength="255" value="" name="onsite_username" id="onsite_username"/>
<label for="onsite_password">Password<abbr title="Required ">*</abbr></label>
<input type="password" class="input-password" maxlength="255" value="" name="onsite_password" id="onsite_password"/>
<input type="submit" value="Log in" name="submit" class="input-submit"/>
</p>
</fieldset>
</form>
and
<form method="post" action="">
<fieldset>
<input type="hidden" value="login" name="form"/>
<div>
<label for="username">Username</label>
<input type="text" class="input-text" value="" name="username" id="username"/>
</div><div>
<label for="password">Password</label>
<input type="password" class="input-password" value="" name="password" id="password"/>
</div>
<input type="submit" value="Aanmelden" class="input-submit"/>
</fieldset>
</form>
Apparently this is not possible due to the way Firefox stores its passwords.
A password-manager entry is stored with the following data
The username (encrypted and secured with Firefox Master Password).
The password (encrypted and secured with Firefox Master Password).
The hostname of the webpage containing the login form.
The hostname of the webpage to which the form data has been submitted.
Thus Firefox does not distinguish between the two loginfields on my page.
I've not yet heard about a multiple form problem in Firefox.
But it could be that Firefox mixed up your 2 login forms if there is another tag around that is not closed properly.
I've had that problem myself with <p> tags and a not properly closed <div> around it.
I'm not sure.. but try to give them a different ID like <form method="POST" action="#" id="login1">

Resources