# Help with understanding and using the form API

**URL:** <https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432>\
**Category:** APIs & Integrations\
**Tags:** forms\
**Created:** [January 29, 2020, 9:47am UTC](https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432 "2020-01-29T09:47:36Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![newbie12](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/newbie12/32/64675_2.png) [@newbie12](https://community.hubspot.com/u/newbie12)\
**Post date:** [January 29, 2020, 9:47am UTC](https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432/1 "2020-01-29T09:47:36Z")

</div>

I have been using normal hubspot forms for my pages. Currently one form requires additional validations and since it cannot be done in the form itself(or can it be done?) I decided to use the Form API but I have been having a hard time.

Form:

```auto
<form id="form_name">
 <div>
 <label for="label1">Device type</label> 
 <input type="text" id="label1" name="label1" required>
 </div>
 <div>
 <label for="label2">Email</label> 
 <input type="email" id="label2" name="label2" required>
 </div>
 <div> <input id="submit_form" name="submit" type="submit" value="submit"> </div>
</form>

```

JS:

```auto
$('#submit_form').click(function() {
 var formJSON = $('#form_name').serializeArray();
 var data = {
 "fields": formJSON
 }
 $.ajax({ url: 'https://api.hsforms.com/submissions/v3/integration/submit/portalID/formID', type: "POST", contentType: "application/json", dataType: "json", headers: { "accept": "application/json", "Access-Control-Allow-Origin":"*" }, data: data, success: function (result) { console.log(result); }, error: function (status, error) { console.log(error, status); } });
});

```

When clicking on the button, nothing happens. I dont get any errors either, so I have no idea where or what I am doing wrong.

Im not good with APIs and ajax so any help is really appreciated.

Thanks.

---

<div class="post-metadata">

**Author:** ![jackcoldrick](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jackcoldrick/32/5119_2.png) [@jackcoldrick](https://community.hubspot.com/u/jackcoldrick)\
**Post date:** [January 29, 2020, 9:57am UTC](https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432/2 "2020-01-29T09:57:02Z")

</div>

Hey @newbie12,

I would recommend using “[submit()](https://api.jquery.com/submit/)” handler in JQuery instead of the “click()”. If you want to check out a working example [here](http://view-source:http://jack.emea-tc.com/forms/api/example-1.html) feel free to do so. If you view the source you can see how I’ve structured my request.

Heres the page:

[http://jack.emea-tc.com/forms/api/example-1.html](http://jack.emea-tc.com/forms/api/example-1.html)

I hope this helps!

Jack

---

<div class="post-metadata">

**Author:** ![Willson](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/willson/32/84663_2.png) [@Willson](https://community.hubspot.com/u/Willson)\
**Post date:** [January 29, 2020, 11:18am UTC](https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432/3 "2020-01-29T11:18:53Z")

</div>

Hey @jackcoldrick, @newbie12

Just reposting the instructions to get to the live example as this view-source link is blocked.

To get to the source, head to the link below and then right-click on the page and select ‘_ **View PageSource** _’ or you can press **Option+Command+U** for Mac or **CTRL+U** for Windows once on the page.

Heres the page:

[http://jack.emea-tc.com/forms/api/example-1.html](http://jack.emea-tc.com/forms/api/example-1.html)

---

<div class="post-metadata">

**Author:** ![newbie12](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/newbie12/32/64675_2.png) [@newbie12](https://community.hubspot.com/u/newbie12)\
**Post date:** [January 30, 2020, 4:05am UTC](https://community.hubspot.com/t/help-with-understanding-and-using-the-form-api/18432/4 "2020-01-30T04:05:31Z")

</div>

Thanks a lot @jackcoldrick @Willson !

Your example helped me to structure and changing the click event to a on submit event helped. Now im getting the submissions to the form in hubspot! Thanks a lot once again!
