If I have this code below to fetch data from the Monday API from a specific board ID XXXX180027 and then passes the fetched data to an autocomplete function, how would I alter it so it only fetches data from the groups on this board with ids: topics, new_group34305 and new_group67377?
var allHospitalNames = [];
function fetchData() {
// Define your API key and board ID
const apiKey = 'MY_API_KEY';
const boardId = 'XXXX180027';
//create an empty clients object to store the data returned from Monday:
var clients = {};
//set up a query to the api and fetch the needed data
let query =
query {
boards(ids: ${boardId}) {
items_page(limit: 500) {
cursor
items {
id
name
column_values {
column {
title
}
text
value
}
}
}
}
}
;
return fetch("https://api.monday.com/v2", {
method: 'post',
headers: {
'Content-Type': 'application/json',
'Authorization': apiKey
},
body: JSON.stringify({
'query': query
})
})
.then(response => response.json())
.then(data => {
// Process the fetched data
const items = data.data.boards[0].items_page.items;
items.forEach(item => {
let hospitalName;
let websiteText;
let clinicLocation;
let hospitalPhone;
hospitalName = item.name;
allHospitalNames.push(hospitalName);
item.column_values.forEach(columnValue => {
if (columnValue.column.title === "Website") {
websiteText = columnValue.text;
}
if (columnValue.column.title === "Address (Text)") {
clinicLocation = columnValue.text;
}
if (columnValue.column.title === "Primary Contact Phone") {
hospitalPhone = columnValue.text;
}
});
clients[hospitalName] = {
website: websiteText,
address: clinicLocation,
phone: hospitalPhone
};
});
return clients;
})
.catch(error => {
console.error('Error fetching data:', error);
throw error; // Re-throw the error to be caught by the caller
});
}
//lets call the fetch to get all clients and their data from Monday:
fetchData()
.then(theClients => {
console.log(theClients);
//now you need to run your autofill code inside this block
autocomplete(document.getElementById("input_32_254"), allHospitalNames, theClients);
//console.log(allHospitalNames);
//now a function to check the Hospital Name field for a selection, once a selection is made by the user
//we then need to query the theClients object for its Website URL and fill that field with the value
})
.catch(error => {
console.error('Error:', error);
});
I’ve tried to modify my code so that it only fetches data from specific groups (topics, new_group34305, and new_group67377). I adjusted the GraphQL query to include a filter for the group IDs:
var allHospitalNames = =];
function fetchData() {
// Define your API key and board ID
const apiKey = 'MY_API_KEY';
const boardId = 'XXXX180027';
const groupIds = ='topics', 'new_group34305', 'new_group67377'];
// Create an empty clients object to store the data returned from Monday
var clients = {};
// Set up a query to the API and fetch the needed data
let query = `
query {
boards(ids: ${boardId}) {
groups(ids: ${groupIds.map(id => `"${id}"`).join(',')}) {
items {
id
name
column_values {
column {
title
}
text
value
}
}
}
}
}
`;
return fetch("https://api.monday.com/v2", {
method: 'post',
headers: {
'Content-Type': 'application/json',
'Authorization': apiKey
},
body: JSON.stringify({
'query': query
})
})
.then(response => response.json())
.then(data => {
// Process the fetched data
const groups = data.data.boardsd0].groups;
groups.forEach(group => {
group.items.forEach(item => {
let hospitalName;
let websiteText;
let clinicLocation;
let hospitalPhone;
hospitalName = item.name;
allHospitalNames.push(hospitalName);
item.column_values.forEach(columnValue => {
if (columnValue.column.title === "Website") {
websiteText = columnValue.text;
}
if (columnValue.column.title === "Address (Text)") {
clinicLocation = columnValue.text;
}
if (columnValue.column.title === "Primary Contact Phone") {
hospitalPhone = columnValue.text;
}
});
clientsthospitalName] = {
website: websiteText,
address: clinicLocation,
phone: hospitalPhone
};
});
});
return clients;
})
.catch(error => {
console.error('Error fetching data:', error);
throw error; // Re-throw the error to be caught by the caller
});
}
// Let's call the fetch to get all clients and their data from Monday
fetchData()
.then(theClients => {
console.log(theClients);
// Now you need to run your autofill code inside this block
autocomplete(document.getElementById("input_32_254"), allHospitalNames, theClients);
// Now a function to check the Hospital Name field for a selection, once a selection is made by the user
// we then need to query the theClients object for its Website URL and fill that field with the value
})
.catch(error => {
console.error('Error:', error);
});
But I’m getting an error in the browser console:
Error fetching data: TypeError: data.data is undefined
fetchData https://stg-XXX-stagingalex.kinsta.cloud/support/:2943
promise callback*fetchData https://stg-ivet360alex-stagingalex.kinsta.cloud/support/:2941
<anonymous> https://stg-XXX-stagingalex.kinsta.cloud/support/:2985
jQuery 9
dispatch
handle
add
ke
each
each
ke
on
bind
<anonymous> https://stg-XXX-stagingalex.kinsta.cloud/wp-content/themes/blankslate/js/scripts.js?ver=6.5.5:2958
Any help here would be greatly appreciated!!
