I get some information using handlebars from backend, and just want to konw how can I get the specific doctorID in javascript when in row button clicked. Any suggestions would be greatly appreciated. Thank you.
html:
<div id="output-doctorinfo"></div>
<script type="text/x-handlebars-template" id="doctorinfo-template">
{{#each this}}
<div class="card col s12 m12" id="doctorinfo">
<div class="card-content black-text">
<input onclick="showAppinfo()" value="{{doctorID}}" class ="doctorid" id="doctor_{{doctorID}}">
<div class="col s9 m9" id="doctortext">
<span class="card-title">{{firstName}} {{lastName}}</span>
<div class="col s12" id="hdn" name="hdn"></div>
</div>
</div>
<div class="card-action col s12">
<div class="row right-align ">
<a class="col s5 btn black-text" id="bookingbutton" href="#modalbooking" onclick="showAppinfo()">Appointments</a>
<a class="col s5 btn black-text" id="ratingbutton" href="#modalratingcheck">Ratings</a>
</div>
</div>
</div>
{{/each}}
</script>
</div>
js:
function showAppinfo(){
var x = document.querySelector(".doctorid").value;
var url = 'api/api.php?action=showAppinfo&doctorid='+ x;
fetch(url,
{
method: 'GET',
credentials: 'include',
headers: {
}
},
)
.then(function(response) {
if(response.status === 204) {
console.log('204 no available appointments')
return;
}
response.json().then(function(data){
console.log(data);
showappinfo.innerHTML = JSON.stringify(data);//按照json格式打印
})
})
.catch(function (err) {
});
}