<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
function postimage()
{
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange= function()
{
document.getElementById("image").innerHTML=xmlhttp.responseText;
}
posted={
fname:document.getElementById("name").value,
}
xmlhttp.setRequestHeader("Content-type","application/json");
xmlhttp.setRequestHeader("X-CSRFToken", '{{ csrf_token }}');
console.log(posted);
xmlhttp.send(JSON.stringify(posted));
}
</script>
</head>
<body onload="get()">
<p id="sampledata1"> status data </p>
<p id="image"> sample image </p>
<input type="file" id="image1">
<br>
<br>
name:<input id="name" placeholder=" enter your name">
<br>
<br>
person:<select id="person" placeholder="enter your pg ">
</select>
<br>
<br>
<button onclick="change()"> Post </button>
<button onclick="postimage()"> post image </button>
</body>
</html>