intégration dans une app en Angular V12

Bonjour,

j'essaye d'intégrer le formulaire dans mon app Angular.

le bloc html de l'iframe contient déjà une hauteur en style inline, cependant le formulaire reste petit et ne s'affiche pas complètement sur l'écran. Comment puis-je faire pour décider de la taille de manière dynamique?

Autre chose, lorsque je change d'étape dans mon formulaire, un rechargement de page est réalisé Mais le scroll automatique ne fonctionne pas et je reste en haut de la page plutôt que de me rendre à l'endroit où le formulaire se situe. Pouvez-vous m'aider?

Merci

Hi Alain, 

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, let me help you with your question. Can you share your site where the form is embedded so we can check? The height of the iframe can be adjusted in the code. Check out the screenshot below:

Also, can you explain more about the automatic scroll? If you can take a screenshot of what’s happening, that will help us to better understand what’s going on. We have a guide about how to do that here.

Once we hear back from you, we'll be able to move forward with a solution.

I was actually looking at your javascript file that is send with the code snippet.

I understand that I can modify the html file, but if i'm not mistaken, your js file is setting the heigth for me. When I try to put it in some console.log() to see if the script is working, I can't see it.

So I think that the script is not loaded by my app.

So I'm actually trying to inject it in this way: with a relative path or also like a cdn. it doesn't work.

I've also try to inject it like that directy on my main HTML file without success.

Thank you

Hi Alain,

Thanks for getting back to us.  I recommend using the inline JavaScript provided in the iframe embed code, as it is likely to work better than having an external link. Given our inability to test your app directly, make sure that the script included in the iframe works in your app. To add a fixed height in the iframe or adjust its height dynamically, you can follow these steps:

1. Add this property in the style attribute min-height:800px in your form's iframe embed code. Just increase the 800px value to one that perfectly fits your entire form while in its initial state. Here's an example:

2. If you don't prefer adding a minimum height, you can adjust it dynamically instead. The script included in the iframe will dynamically change the iframe height based on the total length of the form. If there's a cut-off in the dynamic height, you can add an extra height in the script so it will be added to the calculated dynamic height. To do that, just find this code in the script:

iframe.style.height = args[1] + "px";

Then add your height value followed by two plus signs before the argument e.g. 200 + +

iframe.style.height = 200 + + args[1] + "px";

Give it a try and let us know how it goes.

cela mon programmeur sait le faire et a déjà essayé

le problème c' est la compatibilité avec typescript.

on n'arrive pas à loadé le script dans l'app du moins le script n'est pas pris en compte.(les actions du script ne s'effectuent pas )

le formulaire est bien là on sait le remplir mais quand on clique sur "suivant" ou "envoyer" on remonte tout en haut de la page de mon site au lieu de rester au niveau du formulaire

on a donc mis le lien qui mène à jotform mais cela fait moins professionnel.

Merci

Hi Alain,

Thanks for getting back to us. Have you considered using the form's full HTML source code? Using this method, the form itself becomes part of the page. But you will need to redirect the thank you page to your own web page to make it more professional-looking.

In case you'd like to consider this method, you can check out this guide.

Let us know if this doesn't work for you or if you have more questions.