I need help with figuring out what’s wrong with this code.
I have a form where we are selecting registrations for a course. The registrations in this form is stored in its own table (Registrations). The form only contains one field (a dropdown) which will show relevant employees. All employees are connected to a company, and a project (separate table) can connect to one or more companies.
A course is connected to a project. And when adding a registrations we would like to show only employees for the companies in the current project.
The below code manages to get the companies (organtizations), one or more, and also get the right employees. This debug log contains an array with the employees we would like to have in the dropdown: console.log(“Suksessfullt hentet ansatte:”, response); (success getting employees).
It seems like the code that will put the content of the array in the dropdown do not work. When I tried to set this code “var employeeDropdown = $(‘#view_235_field_72_chzn’);”, just to see if this shows the correct employees, it did, but not in a dropdown.
So the question will be: how to access a dropdown and make changes to it!
$(document).on('knack-view-render.view_235', function(event, view, data) {
console.log("Visning renderes: view_235");
const projectId = getProjectIdFromURL();
console.log("Hentet prosjekt-ID:", projectId);
if (!projectId) {
return console.error('Kunne ikke finne prosjekt-ID.');
}
getOrganizationsForProject(projectId, function(orgIDs) {
console.log("Organisasjons-IDs hentet for prosjekt:", orgIDs);
getEmployeesForOrganizations(orgIDs);
});
});
function getProjectIdFromURL() {
var hash = window.location.hash;
var match = hash.match(/view-kp-project-details\/([a-f0-9]+)/);
console.log("URL hash:", hash);
return match ? match[1] : null;
}
function getOrganizationsForProject(projectId, callback) {
var apiUrl = 'https://api.knack.com/v1/objects/object_10/records';
var filters = JSON.stringify({
"match": "and",
"rules": [
{
"field": "field_41",
"operator": "is",
"value": projectId
}
]
});
console.log("Kaller API for å hente organisasjoner med filter:", filters);
$.ajax({
url: apiUrl,
type: 'GET',
headers: {
'X-Knack-Application-Id': 'xxxxxxxxxxxxxxxxx',
'X-Knack-REST-API-Key': 'xxxxxxxxxxxxxxxx'
},
data: {
'filters': filters
},
success: function(response) {
console.log("Suksessfullt hentet organisasjoner:", response.records);
var orgIDs = response.records.map(function(record) {
var wrapper = document.createElement('div');
wrapper.innerHTML = record.field_42;
var span = wrapper.firstChild;
return span.className; // Her antar vi at klassenavnet er ID-en
});
callback(orgIDs);
},
error: function(xhr) {
console.error("Feil ved henting av virksomheter for prosjekt:", xhr);
}
});
}
function getEmployeesForOrganizations(orgIDs) {
var apiUrl = 'https://api.knack.com/v1/objects/object_12/records';
var filters = JSON.stringify({
"match": "or",
"rules": orgIDs.map(function(orgID) {
return {
"field": "field_48",
"operator": "is",
"value": orgID
};
})
});
console.log("Kaller API for å hente ansatte med filter:", filters);
$.ajax({
url: apiUrl,
type: 'GET',
headers: {
'X-Knack-Application-Id': 'xxxxxxxxxxxxxxx',
'X-Knack-REST-API-Key': 'xxxxxxxxxxxxxxx'
},
data: {
'filters': filters
},
success: function(response) {
console.log("Suksessfullt hentet ansatte:", response);
var employeeDropdown = $('#view_235-field_72');
console.log("Dropdown element:", employeeDropdown);
employeeDropdown.empty();
if(response.records.length > 0){
$.each(response.records, function(index, employee) {
console.log(`Legger til ansatt: ${employee.field_246} med ID: ${employee.id}`);
employeeDropdown.append($('<option>').val(employee.id).text(employee.field_246));
});
} else {
console.log("Ingen ansatte funnet, legger til standardvalg.");
employeeDropdown.append($('<option>').text('Ingen ansatte funnet'));
}
},
error: function(xhr) {
console.error("Feil ved henting av ansatte:", xhr);
}
});
}
