COS Custom module and async HTTP calls

[lscattola]

Hi everyone!
I’m starting to checking the COS functionalities and features from a developer perspective and I have a first question.

I’d like to implement a new custom module which should allow my users to insert an element (a string, an image or something) by choosing it from a list of values read from an external server (in my head this would be an AJAX call).
Would it be feasible? If so, could you point me to the documentation?

Thank you in advance,
Leonardo

[Gonzalo]

Hi @leonardo.scattola,

I understand perfectly what you mean.
I did something similar before but in my case it was really hard to accomplish because I needed some extract info from Hubspot without the API so it was hardcore game.
But a later update they fixed the only way to inject code in the previewer that I have found (in the labels of the fields), so for now I didn’t found any other way to accomplish it.

Anyway I will share with you some tracks about how I did it because maybe you find another way:

1- Get the info. Basic ajax to wherever you want, It was a hard step for me (because reasons that doesn’t apply to your case).

2- Insert the step1 in the custom module. Yep, I know that the preview is framed so you need something like that.

3- Create a function to re-build the field that you want with Select2 (which is the tech. that HS use to populate his selects).

4- Inject the code from the step 3, wrapped in the ready() function inside the label of any field of the Custom Module.

This last step is which doesn’t work anymore. So I don’t find the way to enhance the the previewer for now.

I hope you can!

[3PETE]

@leonardo.scattola Yes that is possible. HubSpot currently doesn’t have any documentation on how to make AJAX calls. You can find some resources on the web that will show you how to execute it in JQuery. Here is the JQuery docs if that helps.

http://api.jquery.com/jquery.ajax/

[lscattola]

Peter,
thank you for your prompt response.
What is missing to me is not how to perform an AJAX call, but how to link the result of this call to the module; in other words, I’d like to generate some HubL elements in the template by using the results of the Ajax call.
The scenario I have in mind is:

1. the editor chooses this custom module and inserts it on the template
2. this module will have a choice field which allows the editor to select one result (a video, for instance) to be inserted in the page
3. when rendered, this page will embed the video selected in the above step.

Thank you,

[3PETE]

@leonardo.scattola Couldn’t the editor just copy and paste the embed code into the page? Why would you need to make a call to something server-side for this?

[lscattola]

Peter, the workflow is this:

• the editor creates a new page, specifying a new “Video player module”
• in its options (if possible), the user will choose a video to be played (received a list of videos via an AJAX request)

Saving the page will then insert into the page (or a DB?) the ID of the video to be played, preparing the page for its fruition.

Thank you,

[3PETE]

@leonardo.scattola The AJAX would only get fired on a page load. It wouldn’t fire within the editing screen on the hubspot app.