Lead Capture Tools

Jice-Lavocat
Participant | Partenaire solutions Platinum
Participant | Partenaire solutions Platinum

Set form field value with Jquery not working

Résolue

Hi there,

 

I'm trying to prepopulate a field on a HS form with JQuery (everything lives on a Vue app).

 

I have read a topic that explicitely says that the value change should be chained with a ".change()" method.

I've done that and, for debug puposes, I'm pre-populating the form on "hsFormCallback[onFormReady]" event. So that when I launch the page, the field is populated with my value. So far so good. Here is the code I'm using :

 

 

var score_global = $("input[name='score_global']");

score_global.val(123).trigger('change');

 

 

However, when I enter some text, in any other field available on the form, the prepopulated value disappears. It seems as if the hsforms script doesn't refresh with the trigger('change') (it does the same if I use .change() instead).

Can anyone guide me here, I don't know what to attempt now?

0 Votes
1 Solution acceptée
Jice-Lavocat
Solution
Participant | Partenaire solutions Platinum
Participant | Partenaire solutions Platinum

Set form field value with Jquery not working

Résolue

Hi @Derek_Gervais ,

 

I eventually managed to fix the problem. The issue originates from a depency issue on JQuery for the hubspot form.js script.

 

To fix that in my Vue.Js app, I had to add the following lines.

 

// Needed by Vue.JS for using Jquery inside the app
import JQuery from 'jquery'
let $ = JQuery

// Needed by Hubspot Form.js
window.jQuery = window.jQuery || JQuery

Voir la solution dans l'envoi d'origine

5 Réponses
btfrost
Membre

Set form field value with Jquery not working

Résolue

If anyone's interested in solving this without jquery...

 

input.value = value;
input.dispatchEvent(new Event('input', { bubbles: true }));
PamCotton
Gestionnaire de communauté
Gestionnaire de communauté

Set form field value with Jquery not working

Résolue

Hey @btfrost  thank you for sharing!

 

Pam

Você sabia que a Comunidade está disponível em outros idiomas?
Participe de conversas regionais, alterando suas configurações de idioma !


Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !




0 Votes
Derek_Gervais
Ancien salarié HubSpot
Ancien salarié HubSpot

Set form field value with Jquery not working

Résolue

Hey @Jice-Lavocat ,

 

I'm having trouble replicating this behavior in my own account. Can you give me a link to the page in question so that I can take a closer look?

0 Votes
Jice-Lavocat
Solution
Participant | Partenaire solutions Platinum
Participant | Partenaire solutions Platinum

Set form field value with Jquery not working

Résolue

Hi @Derek_Gervais ,

 

I eventually managed to fix the problem. The issue originates from a depency issue on JQuery for the hubspot form.js script.

 

To fix that in my Vue.Js app, I had to add the following lines.

 

// Needed by Vue.JS for using Jquery inside the app
import JQuery from 'jquery'
let $ = JQuery

// Needed by Hubspot Form.js
window.jQuery = window.jQuery || JQuery
Derek_Gervais
Ancien salarié HubSpot
Ancien salarié HubSpot

Set form field value with Jquery not working

Résolue

That's awesome, thanks for posting your solution here!

0 Votes