When are forms autofilled in Chrome? - google-chrome

I'm confused about how Chrome decides what forms to autofill. By autofill I mean the inputs are highlighted in yellow and already completely filled in when you land on the page (see picture below). I do not mean autocomplete which is where the input is blank and you get a suggestion only when you start typing in it.
Here's the autofill rules as I understand them:
If your form is located on its own url, e.g., http://mysite.com/login
Your form is present on page load and is NOT loaded via ajax
Comparing my site with Dropbox's we both have a login page: http://localhost/login vs. https://www.dropbox.com/login which satisfies rule #1. The login form gets autofilled for both of us.
My problem is with rule #2. On Dropbox's homepage, www.dropbox.com, they have a "sign in" modal (see picture below) that gets autofilled. On my homepage, http://localhost, I have an identical modal which does NOT ever get autofilled.
I can't figure what the deal is here, can someone chime in? Is it just a localhost vs. real URL issue? If so, how do you explain why http://localhost/login gets autofilled?

When you log into a new site chrome will drop down its notification bar at the top and ask you if you want to save the password, if you tell it "Never" it wont ask again and it wont ever autofill
To get form fields to autofill like street, address, etc, a good answer by kmote
How to trigger Autofill in Google Chrome?,

Related

What is the browser equivalent of autocomplete="off" for all input fields?

We have an existing web application with hundreds of input fields through different applications that has been installed at several sites. At this most recent site, however, we have started having an issue with the back button automatically filling in input fields. This is an issue because the only time we allow the back button is if an error occurred in processing. So the flow is as follows:
1) ask user to scan a barcode
2) an error occurs on the back-end and it directs them to an error page with only a back button
3) the user hits back and is directed to the input page, input form is now filled with the previously inputted data.
I know this is some form of caching or browser issue because when I hit the web app from my personal pc, it doesn't do it. But when they use their android scanning devices and if we load it up on the application server, it does.
I have fixed this on a couple of pages with autocomplete="off" on the input fields, but it just isn't feasible for us to change this on each of hundreds of input fields if we can avoid it. I'm looking for some browser or windows function to turn off to disable this.
I have tried turning off all of the chrome autocomplete fields, and I have tried disabling the cache in dev tools with no luck. Is there another way to disable this without using that autocomplete tag?
If inputs are inside form you can put it on form.
If not you've only one option to use a global script to add attribute on each input something like below but it'll put it on every input and I'm not sure if it'll have any side effects for your case:
field.setAttribute( "autocomplete", "new-password" );
Hope it helps.

anchor links in emails not working after visiting once

So this question has been asked before, but the javascript solution doesn't work for me if I am simply emailing links to members. Here is an example of what I am talking about. I run a social network. When, for example, a user comments on another users profile, I want to email the user who isn't logged in and provide them a link to see the comment. Usually the link would be an onpage link with a # along with an id (example
The first time it works great, but then if you try to click the same link again, or even a link with a different # such as #2100 then it will no longer scroll to the id, once it has previously scrolled to an id.
I have read solutions to this issue, using a click event in javascript, however, how I don't think that that will work when sending out email notifications.
So the scenario is we email someone with a link https://www.domainhere.com/userprofile#1819 and the check it, but the next day we email a similar link with a different # such as https://www.domainhere.com/userprofile#1914 and when they arrive at the page, they don't move from the top of the page. Not sure why this is happening, or how to find a way around it. I've tried adding a unique ID, etc.
Anyone know how to make it so each time a user clicks these links in emails, they will arrive at the anchor? Even if they click the same link, perhaps because the first time they clicked the link in the email, they didn't have enough time to review the content, well once they visit that page, it doesn't matter what the # is, they stay at the top of the page.
The code is very simple. I am using "> as the anchor, and typing into the browser url the name of the page plus #numberhere - It works once, after that it doesn't work. Even if the number is different, ie. a new comment is emailed to the user.
I hope someone can help
Thanks

Auto suggest with Rendering issue

I have an issue in our currently running .net application. we are using autocomplete extender control associated with city textbox for city selection. Due to slow internet connection, when user uses this application with partially rendered, it is not suggesting for entered city (highlighted in red).
I have used Page_Init event for first disable the textbox, than enable it on Page_Load, but it's not working (to prevent user for enter text when the page is not loaded completely).
Is there any solution to overcome this problem?
After loaded successfully,
So you want to disable the textboxes until the page has loaded? I am not sure if it will work like you want but have you considered using jQuery to disable the textbox? For example here, here, here

Shortcut (programmatically) open a link in a new tab without focus to that tab

Google search + Google Chrome browser have this implemented, when you browse the google search results using your up and down arrows (only possible in Chrome browser) and than press CTRL+ENTER it opens the search result selected in a new tab but without focus to that tab. You can now use up and down keys in the same list of search results and CTRL-ENTER more results in new tabs to visit later on.
Does anyone have any idea how this is done? As it only works with Google Chrome at the moment I suspect something is added to the browser as well but I can't find anything on this subject.
The way I have seen this done before is for the webpage to listen for key presses (e.g., j/k) and simply focus() the desired link. Then, when the user presses Enter or Ctrl-Enter, he is simply performing the default operation on the focused link.
Sure enough, when I type this into the javascript console on a Google search result page, I see the links that are being focused.
document.addEventListener('focus', function(e) {console.log(e.target)}, true);
So Google is still using the same technique, although it's not so obvious because they hide the dotted outline around the focused link using CSS (a.noline{outline:0}).

Error with IE and form data when clicking back

Say if I am on page 1 , I enter my form data and go to page 2 , But wait I forgot something and I need to go back. FireFox and Safari ask me if I want to resend my form data.
But IE being IE it just goes back and does not show the page.
Is there away around this when I click back it keeps the data and the page appears.
Sorry I cannot give a link but the process for u to go through on my site to get to this part would take you a while.
My suspicion is that your talking about a wizard form. Where each part of the form is a page and you can go backwards and forwards through the pages.
the back button has always caused problems for developers on the web and this is probably the most annoying.
You can stop the IE back button issue by redirecting on the server to the next page when you receive a form post rather than just delivering the form back to the browser. Doing this means that the browser considers each page to have been a get and stops asking you if you want to resubmit the form.
to do this simply make each form post to itself and then return a redirect to the next page of the wizard. I'd give examples but I'm not sure what language you are using on the server.
the other alternative is to use javascript to create a wizard from your form see this jQuery wizard form demo.
create a new back button besides the submit button and when a user clicks on either one you call a javascript function which modifies the form action either to the next page or the previous page.