Implement ajax part

This commit is contained in:
hodasemi 2018-12-26 10:16:22 +01:00
parent dab27ceaf3
commit 712688969e
2 changed files with 154 additions and 16 deletions

View file

@ -42,7 +42,7 @@ app.get("/items", function (req, res) {
app.get("/items/:id", function (req, res) {
var requested_id = parseInt(req.params.id);
var answer = ["No such id " + requested_id + " in database"];
var answer = ["Err", "No such id " + requested_id + " in database"];
for (var i = 0; i < json.length; i++) {
if (json[i].id == requested_id) {
@ -56,7 +56,7 @@ app.get("/items/:id", function (req, res) {
app.get("/items/:id1/:id2", function (req, res) {
var first_requested_id = parseInt(req.params.id1);
var second_requested_id = parseInt(req.params.id2);
var answer = ["Range not possible"];
var answer = ["Err", "Range not possible"];
// check that first id is bigger than 0
// and the second one is the bigger one
@ -96,7 +96,7 @@ app.get("/properties", function (req, res) {
app.get("/properties/:num", function (req, res) {
let num = parseInt(req.params.num);
var answer = ["No such property available"];
var answer = ["Err", "No such property available"];
var i = 0;
@ -137,7 +137,7 @@ app.delete("/items", function (req, res) {
app.delete("/items/id", function (req, res) {
var requested_id = parseInt(req.params.id);
var answer = ["No such id " + requested_id + "in database"];
var answer = ["Err", "No such id " + requested_id + "in database"];
for (var i = 0; i < json.length; i++) {
if (json[i].id == requested_id) {

View file

@ -1,36 +1,174 @@
$("#filter_countries").click(function () {
alert("filter");
var url = "/items";
var country_filter_range = $("#country_filter_range").val();
var country_filter_id = $("#country_filter_id").val();
if (country_filter_range.length != 0) {
var id_range = country_filter_range.split("-");
// tests for wrong input
// wrong arguments
if (id_range.length != 2) {
return false;
}
// first argument is not a number
if (isNaN(id_range[0])) {
return false;
}
// second argument is not a number
if (isNaN(id_range[1])) {
return false;
}
var first_id = parseInt(id_range[0]);
var second_id = parseInt(id_range[1]);
// bounds checks
if (first_id < 1) {
return false;
}
if (first_id > second_id) {
return false;
}
// assemble url
url += "/" + first_id.toString() + "/" + second_id.toString();
} else if (country_filter_id.length != 0) {
// assemble url
url += "/" + country_filter_id;
}
$.ajax({
type: "GET",
url: url,
async: true,
success: function (data) {
if (data[0] == "Err") {
return;
}
// clear table
$("#table_body").empty();
// refill table
$(function () {
$.each(data, function (i, item) {
$('<tr>').append(
$('<td>').addClass("colID").text(item.id),
$('<td>').addClass("colName").text(item.name),
$('<td>').addClass("colBirth").text(item.birth_rate_per_1000),
$('<td>').addClass("colCell").text(item.cell_phones_per_100),
$('<td>').addClass("colChildren").text(item.children_per_woman),
$('<td>').addClass("colElectricity").text(item.electricity_consumption_per_capita),
$('<td>').addClass("colGDP").text(item.gdp_per_capita),
$('<td>').addClass("colGDPGrowth").text(item.gdp_per_capita_growth),
$('<td>').addClass("colInflation").text(item.inflation_annual),
$('<td>').addClass("colInternet").text(item.internet_user_per_100),
$('<td>').addClass("colLife").text(item.life_expectancy),
$('<td>').addClass("colMilitary").text(item.military_expenditure_percent_of_gdp),
$('<td>').addClass("colGPSLat").text(item.gps_lat),
$('<td>').addClass("colGPSLong").text(item.gps_long)
).appendTo('#table_body');
});
});
// show table
$(`td,th`).show();
},
error: function (jqXHR, text, err) {
alert(err);
}
})
return false;
});
$("#show_selected_prop").click(function () {
alert("filter");
var property = $("#prop_selection").val();
var column = val_to_column(property);
return false;
$(`td:nth-child(${column}),th:nth-child(${column})`).show();
});
$("#hide_selected_prop").click(function () {
alert("filter");
var property = $("#prop_selection").val();
var column = val_to_column(property);
return false;
$(`td:nth-child(${column}),th:nth-child(${column})`).hide();
});
$("#submit_country").click(function () {
alert("properties");
var country_name = $("#country_name").val();
var birth_rate_per_1000 = $("#country_birth").val();
var cell_phones_per_100 = $("#country_cellphone").val();
$.ajax({
type: "POST",
url: "items",
async: true,
data: `{"name":"${country_name}", "birth_rate_per_1000":"${birth_rate_per_1000}", "cell_phones_per_100":"${cell_phones_per_100}"}`,
contentType: "application/json",
success: function (data) { },
error: function (jqXHR, text, err) {
alert(err);
}
});
return false;
});
$("#rm_submit").click(function () {
alert("properties");
var url = "/items";
var id = $("#country_delete_id").val();
if (id.length != 0) {
url += "/" + id;
}
$.ajax({
type: "DELETE",
url: url,
async: true,
success: function (data) { },
error: function (jqXHR, text, err) { }
})
return false;
});
$("#delete_country").click(function () {
alert("properties");
var props = [];
return false;
});
// fill properties
$("document").ready(function () {
$.ajax({
type: "GET",
url: "/properties",
async: true,
success: function (data) {
$(function () {
$.each(data, function (i, item) {
$('#prop_selection').append($("<option />").val(item).text(item));
});
});
props = data;
},
error: function (jqXHR, text, err) {
alert(err);
}
});
});
function val_to_column(value) {
for (var i = 0; i < props.length; i++) {
if (value == props[i]) {
return i + 1;
}
}
return -1;
}