I am building a prescription maker. But I am facing a problem. I want to show to localstorage data in the select box. But I can’t. So I need help. Actually i just need a function that detects my row index of table and print the data according to the index in the input field. Thanks in advance
function editpres(){
var aha = JSON.parse(localStorage.getItem('books'));
document.getElementById('name').value = aha[0].name;
document.getElementById('age').value =aha[0].age;
document.getElementById('sex').value = aha[0].sex;
document.getElementById('date').value = aha[0].date;
document.getElementById('disease').value = aha[0].disease;
document.getElementById('dignosis').value = aha[0].dignosis;
}
<html>
<div>
<table class="table table-success table-striped ">
<thead>
<tr>
<th>Patient Name</th>
<th>Age</th>
<th>Sex</th>
<th>Date</th>
<th>Disease</th>
<th>Dignosis</th>
<th>Medicine</th>
<th>Test</th>
<th></th>
</tr>
</thead>
<tbody id="book-list"></tbody>
</table>
</div>
</html>
<form class="row g-3" id="book-form">
<div class="col-md-5" >
<input type="text" id="name" class="form-control" required placeholder="Give The Patient Name" style="margin-left: 30px; margin-top: 10px;"/>
</div>
<div class="col-md-6">
<input type="number" id="age" class="form-control " required placeholder="Give The Patient Age" style="margin-left: 30px; margin-top: 10px;"/>
</div>
<div class="col-md-5">
<input type="text" id="sex" class="form-control " required placeholder="Give The patient sex" style="margin-left: 30px;"/>
</div>
<div class="col-md-6">
<input type="date" id="date" class="form-control " required placeholder="Give The Vist Date" style="margin-left: 30px;"/>
</div>
<div class="col-md-11">
<input type="text" id="disease" class="form-control" required placeholder="Give The Cheif Complain" style="margin-left: 30px;"/>
</div>
<div>
<input type="button" value="Submit Patient Info" onclick="fillForm();" class="btn btn-success" id="butt" style="margin-left: 30px;"/>
</div>
<div class="col-md-11">
<input type="text" id="dignosis" class="form-control" required placeholder="Give The Dignosis *Submit one at a time" style="margin-left: 30px;"/>
</div>
<div>
<input type="button" value="Submit Dignosis" onclick="newDigno();" class="btn btn-success" id="butt" style="margin-left: 30px;"/>
</div>
<div>
<div class="col-md-11">
<input type="text" id="Medicine" class="form-control" placeholder="Give The Meidicne" style="margin-left: 30px;"/>
</div>
</div>
<div>
<div class="col-md-11">
<select class="form-select" aria-label="Default select example" id="time" style="margin-left: 30px;">
<option selected>Choose...</option>
<option value=""> রাতে খাবার আগে</option>
<option value=""> রাতে খাবার পরে</option>
<option value=""> দুপুরে খাবার আগে</option>
<option value=""> দুপুরে খাবার পরে</option>
<option value=""> সকালে খাবার আগে</option>
<option value=""> সকালে খাবার পরে</option>
<option value=""> তিন বেলা খাবার আগে</option>
<option value=""> তিন বেলা খাবার পরে</option>
</select>
</div>
</div>
<div>
<div class="col-md-11">
<select class="form-select" aria-label="Default select example" id="duration" style="margin-left: 30px;">
<option value=""> ১ দিন</option>
<option value=""> ৩ দিন</option>
<option value=""> ৫ দিন</option>
<option value=""> ৭ দিন</option>
<option value=""> ১৪ দিন</option>
<option value=""> ১৫ দিন</option>
<option value=""> ১ মাস</option>
<option value=""> ২ মাস</option>
<option value=""> চলবে</option>
</select>
</div>
</div>