Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- // Denna fil ska innehålla er lösning till projektuppgiften.
- "use strict";
- // Variables
- var content = document.getElementById("info"); // where the job advertisements will show
- var searchbuttonEl = document.getElementById("searchbutton");
- var leftmenu = document.getElementById("mainnavlist"); // left-hand menu where all län will appear
- var selectbox = document.getElementById("searchlan"); // select box where all län will appear
- var onlyitJob = ""; // empty variable needed for the function showJob. In global scope because otherwise this variable cannot be found if the variable
- // is only in the local scope of function showJob
- var i; // used later in loops for iteration
- var baseUrl = "http://api.arbetsformedlingen.se/af/v0"; // base url where further arguments are being attached to
- // Event Listeners
- window.onload = loadLan; // when window is loaded, the function loadData will fire
- searchbuttonEl.addEventListener("click", searchJob , false); // click on the search button and the function searchJob will fire
- // Skapar händelsehanterare som anropar funktionen showJob. Skickar med ID på det valda elementet.
- selectbox.addEventListener("change", function (e) {
- showJob(e.target.value);
- }, false);
- // Måste skicka med vilket id för länet
- //selectbox.addEventListener("change", showJob, false); //choose a lan from the select box, then the job advertisements of this lan will show
- // Ska inte vara hela listan. Ska vara varje enskilt list-element
- //leftmenu.addEventListener("click", showJob, false); // click on the left-hand menu, then the job advertisements will show
- // Function to get all län to show in the left-hand menu as well as in the select box
- function loadLan() {
- // AJAX request
- var xhr = new XMLHttpRequest();
- xhr.onload = function() {
- // check if server response is OK
- if(xhr.status === 200) {
- var jsonStr = JSON.parse(xhr.responseText);
- var allLan = jsonStr.soklista.sokdata; //all län are being stored in this variable
- //var leftmenu = document.getElementById("mainnavlist"); // left-hand menu where all län will appear
- //var selectbox = document.getElementById("searchlan"); // select box where all län will appear
- // Loop through all län
- for(i=0; i<allLan.length; i++) {
- // Create new element
- // När länen skapar ska det läggas till en funktion för kunna visa jobb i det länet.
- var newLiEl = document.createElement("li"); // Skapar ett nytt li-element
- newLiEl.id = allLan[i].id; // Sätter id på det nya elementet till id från länslistan.
- var newTextEl = document.createTextNode(allLan[i].namn + " (" + allLan[i].antal_ledigajobb + ")"); // Skapaer en textnod med länsnamn och antal lediga jobb.
- newLiEl.appendChild(newTextEl); // Lägger till texten i det nya li-elementet.
- // Skapar en händelsehanterare för det nya elementet. När man klickar på det anropas funktionen med id't på det klickade elementet.
- newLiEl.addEventListener("click", function (e) {
- showJob(e.target.id);
- }, false);
- leftmenu.appendChild(newLiEl); // Lägger in det nya elementet i dom-trädet
- // leftmenu.innerHTML += "<li id='"+ allLan[i].id + "'>" + allLan[i].namn + " (" + allLan[i].antal_ledigajobb + ")"+ "</li>";
- selectbox.innerHTML += "<option value='"+ allLan[i].id+"'>" + allLan[i].namn + "</option>"; // All län will show in the select box on top of the page
- }
- } else if (xhr.status == 400) {
- alert('Error: 400');
- }
- else {
- alert('Error: Something else than 200 was returned');
- }
- }
- // Send AJAX request
- xhr.open('GET', baseUrl+"/platsannonser/soklista/lan", true);
- xhr.send();
- }
- // ID på säkt län skickas med
- function showJob(lanid) {
- // AJAX request
- var xhr = new XMLHttpRequest();
- xhr.onload = function() {
- //check if server response is OK
- if(xhr.status === 200) {
- var jsonStr = JSON.parse(xhr.responseText);
- var allJob = jsonStr.matchningslista.matchningdata; // all job advertisements are being stored in this variable
- var checkitJob = document.getElementById("onlyit").checked; // Checkbox of "show only IT" is checked
- var onlyitJob = "";
- if(checkitJob === true) {
- onlyitJob = "&yrkesomradeid=3"; // extra argument in the AJAX request url if checkbox of "show only IT" is checked
- } else { // if the checkbox of "show only IT" is not checked, onlyitJob has no value
- onlyitJob = "";
- }
- // Töm content.innerHTML för nytt innehåll.
- content.innerHTML = "";
- for(i=0; i<allJob.length; i++) { // shows
- content.innerHTML += "<article>" + "<h3>" + allJob[i].annonsrubrik + "</h3>" + "<h4>" + allJob[i].yrkesbenamning + "</h4>"
- + "<p>" + "<strong>" + "Anställningstyp: " + "</strong>" + allJob[i].anstallningstyp + "</p>" + "<br />"
- + "<p>" + "<strong>" + "Antal platser: " + "</strong>" + allJob[i].antalplatser + "</p>" + "<br />"
- + "<p>" + "<strong>" + "Publiceringsdatum: " + "</strong>" + allJob[i].publiceraddatum + "</p>" + "<br />"
- + "<p>" + "<strong>" + "Sista ansökningsdag: " + "</strong>" + allJob[i].sista_ansokningsdag + "</p>" + "<br />"
- + '<a href="' + allJob[i].annonsurl + '" class="btn" target="_blank">Läs Mer</a>' + "</article>";
- }
- } else if (xhr.status == 400) {
- alert('Error: 400');
- }
- else {
- alert('Error: Something else than 200 was returned');
- }
- }
- // Send AJAX request
- // Behöver inte ta ut vilket element som är valt. Det skickas med som parameter till funktionen.
- //var lanid = document.getElementById("searchlan").value; // to get the ID of the chosen län from the select box
- var numrow = document.getElementById("numrows").value; // the value, i.e. the number, that is shown in "Max antal"
- var url = baseUrl + "/platsannonser/matchning?lanid="+lanid+onlyitJob+"&antalrader="+numrow;
- xhr.open('GET', url, true);
- xhr.send();
- }
- function searchJob() {
- content.innerHTML=""; // the area where the job advertisements are shown is emptied (otherwise former search results will still be shown)
- var input = document.getElementById("searchText").value; //the value of whatever someone has typed into the search box
- // new AJAX request
- var xhr = new XMLHttpRequest();
- xhr.onload = function() {
- //check if server response is OK
- if(xhr.status === 200) {
- var jsonStr = JSON.parse(xhr.responseText);
- var joblist = jsonStr.soklista.sokdata; // all jobs are listed in this variable
- for(i=0;i<joblist.length;i++) {
- content.innerHTML += "<article>" + "<h3>" + joblist[i].namn + "</h3>" + "<br />"
- + "<p>" + "Antal platsannonser: " + joblist[i].antal_platsannonser + "</p>" + "<br />"
- + "<p>" + "Antal lediga jobb: " + joblist[i].antal_ledigajobb + "</p>" + "</article>";
- }
- } else if (xhr.status == 400) {
- alert('Error: 400');
- }
- else {
- alert('Error: Something else than 200 was returned');
- }
- }
- xhr.open('GET', baseUrl + "/platsannonser/soklista/yrken/"+input,true); //a searchlist will show all the jobs that start with the same letters as those typed into "input"
- xhr.send();
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement