How to insert values in HubDB table using Javascript / JQuery

[sjay]

I have developed a GeoIP bar with close icon.

When we click on close icon, the GeoIP bar will be closed. This i've implemented using Java Script.

https://www.columbusglobal.com/en/ (You can find the bar in footer of the page).

So, now i have to maintain the data how many clicks have been done in website.

Here my doubt is, how to insert data in HubDB table using Javascript. Please do help with any example.

[himanshurauthan]

Hello @sjay 

In order to enter new records to HubDB, you need to make an API connection with your HS DB using the API key and need to run the API calls on a third party server ( like PHP or Python )

It means that in order to manage the click counts data, you need to send a post request from client side to server side.

Thanks

[sjay]

Hi @himanshurauthan 

Thanks for your reply.

Instead of using PHP or Phyton scripts, can we write Hubspot API calls.

If yes, how can we write the API calls in Hubspot.

Thanks,

Sanjay

[himanshurauthan]

@sjay 

I don't think that it would be safe to use the HS API key at client side to make API calls. Next I doubt that we can write scripts for the same in HS.
Also my team has worked on same and they have managed all with 2 ends i.e all submissions/input from HS script which sends the post call to make DB connection with the data.

Thanks

[sjay]

Hi,

 HS script which sends the post call to make DB connection with the data.

-> Can you please share the some example of HS scrpt which sends the post to DB connection with the data.

So that directly i can send my Javascript values to HubDB using HS script.

[sjay]

@himanshurauthan  Can you please help me out here.

[himanshurauthan]

Hello @sjay 

Sorry for the late reply.

You can use this js snippet code on the click event of the element.

const request = require('request');
request.post(
         headers: { 'Accept': 'application/json', 'Content-Type': 'application/json'},
         url: 'https://your-site-url.com',
         body: JSON.stringify(data),

        function( error, response, body ) {

            console.log(body);

        }

);

Hope it helps

Thankyou

[sjay]

Hello Himanshu and Team, 

I've generated the API. then it started working. Values are started inserting in my HubDB table.

But I don't know after a few days, API got stopped and it is not working.

Can anyone help me out of this?

Below is my code.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript" src="https://www.columbusglobal.com/hs-fs/hub/494838/hub_generated/template_assets/10184011766/1574314597..."> </script>

<script type="text/javascript" src="x"> </script>

<script>
$(document).ready(function() {
setTimeout(function(){
$.get("https://ipinfo.io", function(response) {
}, "jsonp");

// Click on close icon
$(".close-icon").click(function(){
InsertDBValues('Yes','No','');
$(".geo-ip-bar").hide();
});

// Click on Redirection link
$(".country-text a").click(function(){
var col_country = $(this).text().trim(); // Ex: Columbus India
var col_country=col_country.split(" ");
var country_name=col_country[1]; // India
alert(country_name);
InsertDBValues('No','Yes',country_name);

});
},3000);
});

function InsertDBValues( is_closed, is_redirected,country_name) {
var page_url= window.location; // Get page URL
var dt = new Date();
var timezone_cet= dt.setHours( dt.getHours()+1 ); // Converted CET

$.getJSON('https://ipapi.co/json/', function(data) {



var arr ={ "values": {"2": data.ip, "6": data.country_name, "7": timezone_cet, "8": is_closed, "9": is_redirected, "10": country_name, "11": window.location } };
$.ajax({
url: 'x',
type: 'POST',
data: JSON.stringify(arr),
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: false,
success: function(msg) {

},
error: function(){

}
});
});
} //JSON

</script>

[sjay]

https://www.columbusglobal.com/en/geo

Below is my output.

Below is my table structure.