So, basically I have this modal which pop-ups when I click edit button, the thing is I am able to get values of every input, except of select value.
To get you a little bit familiar with situation here, the process of what’s happening is following:
I have one table (which is dynamically populated by the data from database) – works fine and it basically shows value it should show inside of that table.
Now apart from that I have edit and delete button and when I click edit button modal pop-ups and let’s say I’ve clicked EDIT button on first row of the table, <input> fields in modal pop-up are filled in with data from table (database) corresponding to row where edit button is clicked, except this select thing and what I am expecting that, that same value from table replicates inside of first <option value="" id="vlasnik" name="vlasnik" selected disabled hidden></option> value, so one doesn’t have to remember what was initially selected, and here is how my <select> together with <option> looks like:
<div class="mb-3">
<select id="vlasnik" name="vlasnik" class="form-control form-control-lg" required>
<option value="" id="vlasnik" name="vlasnik" selected disabled hidden></option>
<?php foreach($users as $user): ?>
<option value="<?= $user['id']; ?>"><?= "[" . $user['id'] . "]" . $user['username']; ?></option>
<?php endforeach; ?>
</select>
</div>
And it gives me following:
Also, I must say that I am treating other input’s differently, like this (actually):
// Edit User Ajax Request
tbody.addEventListener("click", (e) => {
if (e.target && e.target.matches("a.editLink")) {
e.preventDefault();
let id = e.target.getAttribute("id");
editUser(id);
}
});
const editUser = async (id) => {
const data = await fetch(`action.php?edit=1&id=${id}`, {
method: "GET",
});
const response = await data.json();
document.getElementById("id").value = response.id;
document.getElementById("make").value = response.make;
document.getElementById("model").value = response.model;
document.getElementById("godina").value = response.godina;
document.getElementById("boja").value = response.boja;
document.getElementById("vin").value = response.vin;
document.getElementById("engine").value = response.engine;
document.getElementById("tip").value = response.tip;
document.getElementById("vlasnik").value = response.vlasnik;
document.getElementById("regoz").value = response.regoz;
document.getElementById("istek").value = response.istek;
document.getElementById("odometer").value = response.odometer;
document.getElementById("napomena").value = response.napomena;
document.getElementById("carStatus").value = response.carStatus;
};
Inside of action.php I have this:
// Handle Edit User Ajax Request
if (isset($_GET['edit'])) {
$id = $_GET['id'];
$user = $db->readOne($id);
echo json_encode($user);
}
And inside of db, readOne method is:
public function readOne($id)
{
$sql = 'SELECT * FROM vozila WHERE id = :id';
$stmt = $this->conn->prepare($sql);
$stmt->execute(['id' => $id]);
$result = $stmt->fetch();
return $result;
}
As I said I get every other value except for option. Does anybody know what is the problem and how can I achieve what I want?
