APIs & Integrations

dimitreliasb
Contributor

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

I have a form that the user enters several values and also some claculations happening. 

I want to show those results in the form of a chart. Has anyone been able to connect with Chart.js ? I guess my problem is how to fetch the data say on an external landing page.

I am using this snippet and it is changing the value as it should.

 

<script>// <![CDATA[
hbspt.forms.create({
        css: '',
	portalId: "My ID",
	formId: "My Form ID",
	onFormReady: function($form) {
           //$('input[name="setup_time"]').val("50").change();
    
	}
});
// ]]></script>

 

What function do I need to try to get the value and send it to the Array in the Chart JS ?

Should something like this work?

 

 var profitMargin = $form.find('input[name="setup_time"]').val();

 

Thanks in advance for anyone taking a look at this.

Basilios

 

0 Upvotes
1 Accepted solution
WendyGoh
Solution
HubSpot Employee
HubSpot Employee

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

Hey @dimitreliasb,

 

Ah thanks for the clarification!

 

When looking to retrieve the form field value after submission, you can do something like this:

 

 hbspt.forms.create({
     portalId: 'portalId',
     formId: 'formId',
     onFormSubmitted: function($form) {
     $form.find('input[name="setup_time"]').val("kitkat2").change();
      var testvalue = $form.find('input[name="setup_time"]').val();
            console.log(testvalue);
   }});

View solution in original post

4 Replies 4
WendyGoh
HubSpot Employee
HubSpot Employee

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

Hey @dimitreliasb,

 

When looking to change a HubSpot form field, you can do something like this:

 

   hbspt.forms.create({
     portalId: 'portalID',
     formId: 'formID',
     onFormReady: function($form) {
           $form.find('input[name="setup_time"]').val("123").change();
     }
   });

 

Let me know if this works!

0 Upvotes
dimitreliasb
Contributor

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

Hi, thank you for the response. This does work but I had already akomlished that part and I must have explained it wrong on my question. 

onFormReady is probably not what I am looking for and I do not need ot change the value aof the field I am actually tryign to pull the value from the fields from an already submitted form that say I just submited on that page.

 

bd

0 Upvotes
WendyGoh
Solution
HubSpot Employee
HubSpot Employee

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

Hey @dimitreliasb,

 

Ah thanks for the clarification!

 

When looking to retrieve the form field value after submission, you can do something like this:

 

 hbspt.forms.create({
     portalId: 'portalId',
     formId: 'formId',
     onFormSubmitted: function($form) {
     $form.find('input[name="setup_time"]').val("kitkat2").change();
      var testvalue = $form.find('input[name="setup_time"]').val();
            console.log(testvalue);
   }});
dimitreliasb
Contributor

Has anyone been able to integrate Chart.js with HubSpot Form Values?

SOLVE

Thanks! I used the same approach but used the 

onFormReady instead of onFormSubmitted

0 Upvotes