# Refresh form without refreshing the page **URL:** \ **Category:** CMS Development\ **Tags:** javascript, forms\ **Created:** [March 4, 2020, 3:15pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211 "2020-03-04T15:15:25Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![benji\_thecroc](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/benji_thecroc/32/31851_2.png) [@benji\_thecroc](https://community.hubspot.com/u/benji_thecroc)\ **Post date:** [March 4, 2020, 3:15pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/1 "2020-03-04T15:15:25Z")
Hi, We have a couple of form modules that currently display an inline message after submission. I was wondering if there was a way to reload the form to it’s original state on a button click? In our template a user can fill out the form and then click through to a different screen state where the form is hidden, ideally we’d want to form to reload at this point and be submittable again btu I don’t think there’s a way to do this without refreshign the page. I considered setting the form up so that it redirects to the page but with a # in the URL and fire a function to dynamically put the user back to the relevant screen state btu I can’t do this. Thanks, Benji ---
**Author:** ![valerajoey](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/valerajoey/32/35482_2.png) [@valerajoey](https://community.hubspot.com/u/valerajoey)\ **Post date:** [March 5, 2020, 12:10am UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/2 "2020-03-05T00:10:00Z")
hey Benji, I have two solutions that you can try. First one needed you to set up a server, the Idea is to create a separate form from scratch. and hitting the submit button will first send its data to HubSpot via API, the next function will it’s up to you. You can clear its field content or you can create a preloader and just refresh the form. The second solution is, creating the form through form embed,     hbspt.forms.create({                          portalId: ‘’,                          formId: ‘’,                          onFormSubmitted: function($form) { // YOUR SCRIPT HERE } }); and after submitting try creating a new HubSpot Form. make sure you are using the inline message. I’m not sure if this will work though, but worth a try. ---
**Author:** ![YChuskit](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ychuskit/32/13521_2.png) [@YChuskit](https://community.hubspot.com/u/YChuskit)\ **Post date:** [December 16, 2021, 2:36pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/3 "2021-12-16T14:36:33Z")
hey @valerajoey, hbspt.forms.create({ portalId: ‘2333626’, formId: ‘9a3ba836-f31f-4869-8d28-d264cc4259a8’, onFormSubmit: function($form) { $form[0].reset(); } }); is this rigth code ? what should be the js here onFormSubmit: function($form) { what should i write here ? } i tried above code but i am getting error ---
**Author:** ![RLeo](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/rleo/32/9140_2.png) [@RLeo](https://community.hubspot.com/u/RLeo)\ **Post date:** [February 22, 2022, 3:38pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/4 "2022-02-22T15:38:45Z")
Hi YChuskit, I know its a bit late, but one way I found is to create the form again after submitting the form. Just make sure to display a thank you message on the form settings (no redirect). Tested it and works: ```lia-code-sample $(document).ready(function(){ window.addEventListener('message', event => { if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') { hbspt.forms.create({ region: "na1", portalId: "{{ADD YOUR PORTAL ID HERE}}", formId: event.data.id, target: ".modal-body" // Add the element class where you need to create the form again }); } }); }); ``` Regards, ---
**Author:** ![AHubble](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ahubble/32/5125_2.png) [@AHubble](https://community.hubspot.com/u/AHubble)\ **Post date:** [May 23, 2022, 9:06pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/5 "2022-05-23T21:06:24Z")
Hi RLeo, Trying to do this myself. Are you adding this code to the module in HubDB, or to the Source Code in the Thank You Message? ---
**Author:** ![RLeo](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/rleo/32/9140_2.png) [@RLeo](https://community.hubspot.com/u/RLeo)\ **Post date:** [May 24, 2022, 7:10am UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/6 "2022-05-24T07:10:14Z")
Hi AHubble, This was tested while the form was in an external or Hubspot page, so this script goes in that page. Haven’t tested if it works on a module, I think it should. ---
**Author:** ![spotted123](https://avatars.discourse-cdn.com/v4/letter/s/9fc348/32.png) [@spotted123](https://community.hubspot.com/u/spotted123)\ **Post date:** [May 31, 2022, 11:05pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/7 "2022-05-31T23:05:53Z")
Should this work with a raw form? Been trying for hours and can’t get this to work. ---
**Author:** ![AZhu3](https://avatars.discourse-cdn.com/v4/letter/a/82dd89/32.png) [@AZhu3](https://community.hubspot.com/u/AZhu3)\ **Post date:** [May 27, 2022, 5:00pm UTC](https://community.hubspot.com/t/refresh-form-without-refreshing-the-page/19211/8 "2022-05-27T17:00:30Z")
Hubspot does not provide an api for reload form. After the first submission, the form cannot be used, i have tried many methods to no avail. Finally, i found that the iframe that refreshes the form page can reload the form. ![AZhu3_1-1653670805416.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/a/a/aad607eaa66f28ae7098e4539e0ac83bb0b88042.png) onFormSubmitted: function($form) { document.getElementById(‘hs-form-iframe-0’).src=document.getElementById(‘hs-form-iframe-0’).src; }