h4ckx0r/LMSGI-2024-25
1
0
Fork 0
mirror of https://gitlab.com/tutorial-java-rafa-munoz/tutorial-java-2024-25/LMSGI-2024-25.git synced 2025-11-09 18:03:06 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(js): genders example

Browse Source
This commit is contained in:
Rafa Muñoz
2025-03-24 14:48:58 +01:00
parent a1fd008a8e
commit a2283cbce2
1 changed files with 52 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
Unidad_05_Javascript/AccesoSimpleBackenAPI/accesoGenders.html
View File

@@ -11,12 +11,16 @@
const xhttp = new XMLHttpRequest(); const xhttp = new XMLHttpRequest();
xhttp.onload = function () { xhttp.onload = function () {
if (xhttp.readyState === 4) { // 4 = La solicitud ha sido completada
if (xhttp.status === 200 || xhttp.status === 201) {
let strResponse = xhttp.responseText; let strResponse = xhttp.responseText;
console.log("Datos recibidos: " + strResponse); console.log("Datos recibidos: " + strResponse);
let jsonResponse = JSON.parse(strResponse); let jsonResponse = JSON.parse(strResponse);
console.log("Datos parseados: " + jsonResponse); let responseArray = jsonResponse.content;
for (let i = 0; i < jsonResponse.length; i++) { console.log("Datos parseados: " + responseArray);
let genero = jsonResponse[i]; for (let i = 0; i < responseArray.length; i++) {
let genero = responseArray[i];
console.log("Género: " + genero.id + " - " console.log("Género: " + genero.id + " - "
+ genero.nombre); + genero.nombre);
gendersTable.innerHTML += '<tr>' + gendersTable.innerHTML += '<tr>' +
@@ -25,15 +29,50 @@
'</tr>' '</tr>'
} }
} }
else {
console.log('Error al obtener la petición xhr.status: ' + xhttp.status);
}
}
}
// Send a request // Send a request
xhttp.open("GET", "http://localhost:8081/v1/genders"); xhttp.open("GET", "http://localhost:8081/v1/genders?page=0&size=100&fieldOrder=id&orderType=desc");
xhttp.send(); xhttp.send();
} }
function updateGender() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function () {
if (xhttp.readyState === 4) { // 4 = La solicitud ha sido completada
if (xhttp.status === 200 || xhttp.status === 201) {
alert("Modificado correctamente");
}
else {
console.log('Error al obtener la petición xhr.status: ' + xhttp.status);
}
}
}
// Send a request
xhttp.open("PUT", "http://localhost:8081/v1/genders/1");
xhttp.setRequestHeader("accept","application/json");
xhttp.setRequestHeader("Content-Type","application/json");
xhttp.send(JSON.stringify({
"id": 1,
"nombre": "Ciencia Ficción modificado 2"
}));
}
</script> </script>
</head> </head>
<body onload="loadGenders()"> <body onload="loadGenders()">
<button onclick="updateGender();">Modificar género</button>
<table id="gendersTable" border="1" width="100%"> <table id="gendersTable" border="1" width="100%">
<tr> <tr>
<th>Id</th> <th>Id</th>