Autocompleted Address Widget - Can't change placeholder

Bonjour,

Pour ce formulaire https://eu.jotform.com/build/231314171664046 j'utilise le widget Saisie automatique de l'adresse afin d'avoir une vérification des adresses. Cependant le placeholder est en anglais comment faire pour changer la langue de celui-ci ?

Dans l'attente de votre retour, je vous souhaite une excellente journée,

Hi tools_tools353, 

Thanks for reaching out to Jotform Support. Unfortunately, our French Support agents are busy helping other Jotform users at the moment. I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in French, let us know and we can have them do that. But, keep in mind that you'd have to wait until they're available again.

Now, to help you with your question. Unfortunately, the placeholder in Autocompleted Address Widget is not editable into the widget settings. It is also not possible to change it using CSS. We've gone ahead and escalated your request to our developers, but when or if it's developed depends on their workload, how viable it is, and how many other users also request it. If there are any updates, we’ll circle back to this thread and let you know.

Thanks for your patience and understanding, we appreciate it.

Hi tools_tools353,

I just want to share the workaround I found with CSS code that lets you change the placeholder of the said widget into any text that you like. Let me show you how to do that:

1. In the Form Builder, click on the Autocomplete address widget then click on the wand icon to open its settings.

2. In the settings panel on the right, go to Custom CSS at the top.

3. Paste the CSS code below in the text area.

#autocomplete::placeholder {

opacity:0;

}

#autocomplete{

position:relative;

z-index: 9999;

background: transparent;

}

#autocomplete:not(:focus) + #results:before,

#autocomplete:placeholder-shown + #results:before{

content:"Entrez votre adresse email";

position: absolute;

top: -32px;

left: 4px;

font-size: 18px;

opacity: 0.5;

z-index:1;

}

#autocomplete:not(:placeholder-shown) + #results:before{

content:" ";

}

.address-input {

background: #fff;

padding: 0;

margin: 5px;

border-radius: 6px;

}

4. Select Update Widget at the bottom to save the changes.

Feel free to change the text "Entrez votre adresse email" found in the code to your preference.

Here's a demo that shows a translated placeholder text on the autocomplete address widget.

Let us know if you have more questions.