Create Models.py
class Reg(models.Model):
uname= models.CharField(max_length=20)
pwd=models.CharField(max_length=10)
email=models.CharField(max_length=20)
mobile = models.CharField(max_length=12)
def __str__(self):
return "uname is "+str(self.uname)+ " password is "+self.pwd + " emailid is "+self.email+ "mobile no is "+str(self.mobile)
Create Urls.py with two different view methods?
path('reg',views.reg,name='reg'),
path('regcode',views.regcode,name='regcode')
Create views.py
def reg(request):
return render(request,"dbapp/reg.html")
def regcode(request):
print("data is ",request.GET["uid"])
r=Reg(uname=request.GET["uid"],pwd=request.GET["upass"],email=request.GET["email"],mobile=request.GET["mobile"])
r.save()
return HttpResponse("data inserted successfully")
Crate HTML page under templates
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function submitdata()
{
var uid = document.getElementById("txtuser").value;
var upass = document.getElementById("txtpass").value;
var email = document.getElementById("txtemail").value;
var mobile = document.getElementById("txtmobile").value;
alert(uid);
console.log(upass);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
document.getElementById("result1").innerHTML = xmlhttp.responseText;
}
xmlhttp.open("GET","regcode?uid="+uid+"&upass="+upass+"&email="+email+"&mobile="+mobile,true);
xmlhttp.send();
}
</script>
</head>
<body>
<input type="text" name="txtuser" id="txtuser" placeholder="Enter username" onblur="checkusername(this.value)" /> <span id="result"></span>
<br><br>
<input type="password" name="txtpass" id="txtpass" placeholder="Enter password" />
<br><br>
<input type="text" name="txtemail" id="txtemail" placeholder="Enter email" />
<br><br>
<input type="text" name="txtmobile" id="txtmobile" placeholder="Enter mobile" />
<br><br>
<input type="button" name="btnsubmit" value="Reg" onclick="submitdata()" />
<div id="result1"></div>
</body>
</html>
HTML file for Jquery?
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btnsubmit").click(function(){
var uid = $("#txtuser").val();
var upass = $("txtpass").val();
var email = $("txtemail").val();
var mobile = $("txtmobile").val();
alert(uid);
console.log(upass);
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
$("#result1").html(xmlhttp.responseText);
}
xmlhttp.open("GET","regcode?uid="+uid+"&upass="+upass+"&email="+email+"&mobile="+mobile,true);
xmlhttp.send();
})
});
</script>
</head>
<body>
<input type="text" name="txtuser" id="txtuser" placeholder="Enter username" onblur="checkusername(this.value)" /> <span id="result"></span>
<br><br>
<input type="password" name="txtpass" id="txtpass" placeholder="Enter password" />
<br><br>
<input type="text" name="txtemail" id="txtemail" placeholder="Enter email" />
<br><br>
<input type="text" name="txtmobile" id="txtmobile" placeholder="Enter mobile" />
<br><br>
<input type="button" name="btnsubmit" id="btnsubmit" value="Reg" />
<div id="result1"></div>
</body>
</html>
POST Answer of Questions and ASK to Doubt