i have a django template which displays some information. i want to save these multiple info into another database model with a button click.
{% extends 'mainpage.html' %}
{% load static %}
{% block content %}
<div class="container">
<div style="clear: both">
<h2 style="float: left">Cart Items</h2>
<h4 style="float: right">No.of Items: {{total}}</h4>
</div>
<input class="form-control" id="myInput" type="text" placeholder="Search..">
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th class="w1">No</th>
<th class="w2">Send Date</th>
<th class="w4">Send To</th>
<th class="w5">Product Description</th>
<th class="w6">Model No.</th>
<th class="w7">Serial No.</th>
<th class="w8">Received By</th>
</tr>
</thead>
<tbody id="myTable">
{% for item in items %}
<tr>
<td class="w1">{{forloop.counter}}</td>
<td class="w2">{{item.date_added.date}}</td>
<td class="w4">{{item.product.issued_to.name}}</td>
<td class="w5">{{item.product.toner_model.toner_printer.description}} toner</td>
<td class="w6">{{item.product.toner_model.toner_printer.model_no}}</td>
<td class="w7">{{item.product.toner_model.toner_model}}</td>
<td class="w8 name=employee_name">{{item.product.employee_name}}</td>
</tr>
{% endfor %}
</tbody>
</table>
<td><a onclick="getCartItemData('{{item.id}}', 'add','{{item.product.employee_name}}')" data-item="{{item.id}}" data-action="add" class="btn btn-info dispatch">Dispatch</a></td>
</div>
<script>
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});
</script>
</div>
What I have tried:
i am trying to use fetch api
function getCartItemData(itemId, action,employee_name){
console.log(itemId)
console.log(action)
console.log(employee_name)
console.log(user)
if (user === 'AnonymousUSer'){
console.log('Not Logged in')
}else {
updateSentItems(itemId,action,employee_name )
}
}
function updateSentItems(itemId,action,employee_name ){
console.log('User is loged in,sending data')
var url='/sent_items/update_sent_items/'
fetch(url,{
method:'POST',
headers:{
'Content-Type':'application/json',
'X-CSRFToken':csrftoken,
},
body:JSON.stringify({'itemId':itemId,'action':action,'employee_name':employee_name })
})
.then((response)=>{
return response.json()
})
.then((data)=>{
console.log('data:',data)
location.reload()
})
}