Conservancy/reimbursinator
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add frontend save section functionality

Browse source
This commit is contained in:
Preston Doman 2019-02-13 00:48:35 -08:00
parent 60eddf7ca4
commit 74098cf80c
2 changed files with 37 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
back/backend/views.py
View file

@ -154,6 +154,8 @@ def report_detail(request, report_pk):
# update a section with new data # update a section with new data
@api_view(['PUT']) @api_view(['PUT'])
def section(request, report_pk, section_pk): def section(request, report_pk, section_pk):
""" original stub
data = { data = {
"message": "Updated report {0}, section {1}.".format(report_pk, section_pk), "message": "Updated report {0}, section {1}.".format(report_pk, section_pk),
"fields": { "fields": {
@ -163,5 +165,11 @@ def section(request, report_pk, section_pk):
"lowest_fare_screenshot": "image", "lowest_fare_screenshot": "image",
} }
} }
"""
data = {
"message": "Updated report {0}, section {1}.".format(report_pk, section_pk),
"request.data": request.data
}
return JsonResponse(data) return JsonResponse(data)

32
front/static/js/viewHistory.js
View file

@ -9,6 +9,10 @@ function getEndpointDomain() {
return "https://" + window.location.hostname + ":8444/"; return "https://" + window.location.hostname + ":8444/";
} }
function alertCallback(parsedData) {
alert(JSON.stringify(parsedData));
}
function makeAjaxRequest(method, url, callback, type, payload) { function makeAjaxRequest(method, url, callback, type, payload) {
const token = localStorage.getItem("token"); const token = localStorage.getItem("token");
const xhr = new XMLHttpRequest(); const xhr = new XMLHttpRequest();
@ -17,7 +21,17 @@ function makeAjaxRequest(method, url, callback, type, payload) {
xhr.open(method, url, true); xhr.open(method, url, true);
xhr.setRequestHeader("Authorization", "Bearer " + token); xhr.setRequestHeader("Authorization", "Bearer " + token);
method === "POST" ? xhr.setRequestHeader("Content-Type", "application/json") : payload = null;
switch (method) {
case "PUT":
break;
case "POST":
xhr.setRequestHeader("Content-Type", "application/json");
break;
default:
payload = null;
break;
}
xhr.onreadystatechange = function() { xhr.onreadystatechange = function() {
if (this.readyState === 4) { if (this.readyState === 4) {
@ -217,8 +231,10 @@ function createReportForm(parsedData, type) {
// Create a new form with the section key index as id // Create a new form with the section key index as id
let form = document.createElement("form"); let form = document.createElement("form");
form.classList.add("form"); form.classList.add("form", "section-form");
form.id = "form" + key; form.id = "form" + key;
form.setAttribute("data-rid", parsedData.report_pk);
form.setAttribute("data-sid", section.id);
// Traverse the fields of this section // Traverse the fields of this section
let fields = section.fields; let fields = section.fields;
@ -238,7 +254,7 @@ function createReportForm(parsedData, type) {
let saveButton = document.createElement("button"); let saveButton = document.createElement("button");
saveButton.innerHTML = "Save"; saveButton.innerHTML = "Save";
saveButton.type = "submit"; saveButton.type = "submit";
saveButton.classList.add("btn", "btn-primary"); // TODO: add eventListener saveButton.classList.add("btn", "btn-primary", "save-section"); // TODO: add eventListener
form.appendChild(saveButton); form.appendChild(saveButton);
// Create collapsible card body, append form to it, append card to accordion // Create collapsible card body, append form to it, append card to accordion
@ -411,3 +427,13 @@ if (newReportForm) {
this.reset(); this.reset();
}); });
} }
document.addEventListener("submit", function(event) {
if (event.target.classList.contains("section-form")) {
event.preventDefault();
console.log(event.target);
const formData = new FormData(event.target);
const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid + "/section/" + event.target.dataset.sid;
makeAjaxRequest("PUT", url, alertCallback, null, formData);
}
});