Hi, i’d like to edit a record from a custom file with included common files, i’ve successfully did it by:
<html>
<head>
<title>Modulo di Inserimento Dati</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<form id="dataForm">
<label for="km">Distanza:</label>
<input type="text" name="km" id="km" /><br />
<br>
<label for="costi_vari">Costi Vari:</label>
<input type="text" name="costi_vari" id="costi_vari" /><br />
<br>
<label for="costo_materiale">Costo Materiale:</label>
<input type="text" name="costo_materiale" id="costo_materiale" /><br />
<br>
<button id="btn-save" class="btn btn-default ew-btn">Invia Dati</button>
<button id="btn-back" class="btn btn-default ew-btn" data-bs-dismiss="modal">Annulla</button>
</form>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<?php
$id = isset($_GET['x_id']) ? $_GET['x_id'] : 0;
?>
<script>
$(document).ready(function() {
apilogin(function(jwtToken) {
$('#btn-save').click(function(event) {
sendCurlRequest(jwtToken);
});
});
});
function apilogin(callback) {
// LOGIN
$.ajax({
type: "POST",
url: "api/login",
contentType: "application/x-www-form-urlencoded",
data: {
username: "apiuser",
password: "apipwd.",
securitycode: "",
expire: "",
permission: ""
},
success: function(res) {
var jwtToken = res.JWT;
callback(jwtToken); // Chiamata di callback con il token JWT
},
error: function(error) {
console.error("Errore durante il login: " + JSON.stringify(error));
}
});
}
function sendCurlRequest(jwtToken) {
var km = $("#km").val();
var costi_vari = $("#costi_vari").val();
var costo_materiale = $("#costo_materiale").val();
var object = "lavori";
var key = "<?php echo $id; ?>"; // Assicurati che $id sia correttamente reso in JavaScript
$.ajax({
url: "api/edit/" + object + "/" + key,
type: "POST",
headers: {
"X-Authorization": "Bearer " + jwtToken,
"Content-Type": "application/json",
"accept": "*/*"
},
data: JSON.stringify({
"km": km,
"costi_vari": costi_vari,
"costo_materiale": costo_materiale
}),
success: function (data) {
console.log("Richiesta riuscita: " + data);
},
error: function (error) {
console.error("Errore: " + JSON.stringify(error));
}
});
}
</script>
I call the custom file from the list page of the table where the record is, it open a modal page with 3 fields that i need to edit.
this method has two problems:1) the apilogin function will logout my user from the webpage and relogin with apiuser, tht’s not what i want. is’ there somwhere i can retrive my session JWT? i’ve see that periodically the webpage is lounching a api/session?rnd=***** call, where i have the JWT that i need, do you know if there is a way to call this api when i open the modal page to save my JWT? or do you have a better idea?2) when i click the save button (btn-save → Invia Dati) everything will be saved but i’ll be sent to not my previous page (lavorilist) but to lavorilist?km=&costi_vari=&costo_materiale=****, like if it is a GET call. Is there a way to avoid this?Thanks for your help, if you have better solutions than REST API or better idea to achive this you are welcome.
You should not add html/head/body tag in Custom File with Include Common Files, because the common files already include them and there is no need to include jQuery again. Alternatively, since your code does not use common functions so you can choose not to use Include Common Files and add the required HTML yourself,
If you use your Custom File internally (i.e. for the users who logs in your site), there is no need to login again by JavaScript, you don’t need to get JWT token yourself, when the user logs in normally via the login page, the user will get the JWT token, (assumed v2024)
I don’t quite sure what you are trying to do, it seems that you want to go to the page with URL parameter x_id=xxx so that you can edit a record, your code logs in the user with your API username and passord and submit the form by Ajax and edit the record via the REST API. I assume you try to allow external users (not logged in to your site) to edit the record. Problems of your code are, the user’s username and password are exposed in the JavaScript, and as said, if the user already logs in, there is no need to login again.
If your Edit page for the “lavori” table is not set up as modal, it will return to the List page by default. If it is set up as modal, JSON will return, and your “success” callback should be able to handle it (e.g. check the result and close your modal).
Hi, yes, i’m using the last v2024,1) As suggested I’ve removed unnecessary parts from the code but i will use common functions in another part of this custom file so i prefer to mantain the common files included.2) I exclusively use this custom file for internal, logged-in users. However, I’ve encountered a 401 error when I removed the “apilogin” function and the “X-Authorization” headers. It appears that a JWT token is still required. Is there a way to retrieve the JWT token from the current user?3) I have a table with numerous fields, and I want to provide a user-friendly and secure way for “normal” users to edit specific fields. Using the standard edit functionality for only these three fields, which are somewhat hidden, doesn’t seem ideal. By the way, “x_id” represents the row number for editing the chosen record.4) I’ve noticed that when I edit fields, the page returns to the list view, but it appends the edited values to the URL as query parameters. For instance, the URL becomes something like http://localhost/kp/lavorilist?km=1&costi_vari=2&costo_materiale=3 where “km=1,” “costi_vari=2,” and “costo_materiale=3” are the edited values. Instead, I’d prefer the URL to return to the list view without these query parameters, maintaining the previous filters. Just to clarify, my project-generated page is modal, and my custom file’s edit page is also modal.The button that i used to open my modal edit page is:
I exclusively use this custom file for internal, logged-in users. However, I’ve encountered a 401 error when I removed the “apilogin” function and the “X-Authorization” headers. It appears that a JWT token is still required. Is there a way to retrieve the JWT token from the current user?
JWT token is required to use the REST API. What I meant was, you don’t need to add it yourself. It will be added automatically if the user is logged in. You can check the HTTP headers of your Ajax request in your browser. (Make sure you don’t include jQuery again or your jQuery overwrites the original jQuery with code to send the header.)
Note that even you remove some fields from your form, if you submit to the built-in API of the table, it still uses all selected fields of the table. You need to make sure your Edit page allows submitting only reduced number of fields in your alternative form.
The return URL for the List page should not contain edited values. If you have entered your URL for the Return Pages → After Edit, you better double check the URL. Otherwise, you may try remove the contentType setting and JSON.stringify() in your code as it is unnecessary.
yes, this is exactly my problem, i don’t have the JWT token in my header, in no page, the only page where i have the JWT token in headers (X-Authorization) is when the webpage automatically call api/session?rnd=*****.
i have an Auto-login Cookie but not the JWT token
You need to make sure your Edit page allows submitting only reduced number of fields in your alternative form
i’m sure i can, i can do exactly what i want from Swagger3) in Return Pages → After Edit i have ListPage, i’ve other pages too, but it is ignored. i’ve removed the contentType and JSON.stringify() too
Thanks
This code will send the api request, close the modal page (data-bs-dismiss=“modal”) and refresh (window.location.reload() the list page.
now the only problem is the JWT token that is not in my logged in users.
Thanks for your help
the list page.