I have a form that I am building with Gravity Forms in wordpress. The current layout with the different steps is attached to this post.
What I want from you is as follows, the number corresponds to the picture attached:
1) The user will select province, region and sector. The user can only select region and sector when province is "Quebec", otherswise the user will get only the province selection option. Whatever the user select THE GOOGLE MAP SHOULD ALREADY HAVE A FOCUS ON THAT REGION. Say for example, the user selects "Province = British Columbia", then the google map will automatically zome to show british columbia. If the user selects the combition of Province/Region/Secteur = Quebec/Montreal (ile de)/Plateau" then the google map will zoom onto the plateau borough in Montreal, Quebec.
2) The user will then have an option of entering his full address or an intersection in the autofill field above the google map.
3) When the user makes a selection of civic address, then a pin will show on the map for that address. IT IS REALLY IMPORTANT THAT THIS IS A DRAGGABLE PIN. Because the user can get another chance at making his address more precise by moving the pin.
4) The last and not the least is that whatever position the pin has on the map in 3), the fields "Adresse, code postal, Latittude, longitude" should be automatically filled with information from the pin on the google map.
5) - NOT ON THE ATTACHED PIC - I will have the opportunity of editing the image of the pin from the regular google map red tear drop pin image.
6) - NOT ON THE ATTACHED PIC - Right now there is a bug whereas when the user hit enter to validate the choice from the autofill, this action also validates the submit button of the page and the form moves to page 4, I want that not to happen.
Please send me your previous work as an example.