arrow down does not save input after I click somewhere else

[kirumosan]

Hello,
Amazing work!
I managed to play a bit with it in my project, but i have a rookie question... i try to find where in the JS code some event is triggered to bypass it but i don't find the answer, could you please explain? It happens when i do so:

1-I fill in the form,
2-i hit the arrow down key
3-I press enter: the input hidden are filled nicely, BUT
4- if i click anywhere else after hitting enter everything disapears in the hidden fields except the raw address, so if i, by mistake, I hit submit, only the raw field will be populated, even if i agreed with the address entered at step 3.

PS: it seems to work fine when the user would only perform each steps when clicking on the address, all data are kept in the hidden fields.

Guess it is a very easy question for you guys, but i went through the code for a week now and don't find the answer..
++

[banagale]

@kirumosan Thank you for the question. It is possible that the frontend library is inappropriately dropping the data.

I will try to validate this when I can. I would like to move the entire library away from jquery anyhow.

It is possible that other folks have made customizations to the frontend autofill.

[panosangelopoulos]

Hi @kirumosan and @banagale ,

I was trying to reproduce your issue but I couldn't, could you please try it out without extensions or even better in a private mode?

Moreover, it will be helpful to let us know the browser version which you are using.

Video Screen Record

[kirumosan]

Hello @panosangelopoulos
I am using both:
Firefox(86.0.1 (64 bits)),
Chrome(Version 91.0.4472.77 (Official Build) (x86_64)),
and Brave(Version 1.22.72 )

Also, I am not sure of what you mean by extensions, but I used the Module blank, and to sum up,
When I click: on the wanted adress given by google in the dropdown, i can store each field in my database.
When I select manually (arrow down until the wanted adress, then press Enter), only the Raw value is registered in the Database,
Hope this was of assistance..
PS:Do you need a short video to show you what i mean exactly?

[panosangelopoulos]

@kirumosan thanks a lot for your reply, a short video will be helpful I guess. Or even better could you please change the method type from POST to GET in the form and check if the address_* fields are empty or not?

[kirumosan]

djangoAddressEnterTabIssue.mp4

Sorry the video is short but i am limited to 10MB .
So basically, hitting the enter key accepts to form, but, after the user has to submit. when you click on submit or submit the form simply, all the details are removed as if there pas a post event listener that checks if the user pressed enter. i found it in the js, tried to bypass it but without success. maybe you know better on why it was programed so, but as a user i am oftenly switching using the keyboard and hitting enter is what i did at the beginning. Still, if you simply click on the desired address, everything comes naturally in the database as expected

[banagale]

From what I can tell, this behavior is now offered in google's autocomplete js library. 

I have this open ticket to rip out use of jquery and instead import and use the google one. 

Can anyone look into and back up this course of action? The JS dependency in Django Address now is deprecated.