Update 29/08/24 · Read 2 minute
standard function format ajax jquery
$.ajax({
method: "POST",
url: url,
data: data,
contenType: Type,
success: function(){},
error: function(){}
});
for example html form send data json:
<div class="col-3 ml-3"> <h4>Register</h4> <form id="sigup"> <div class="mb-3"> <label for="exampleInputEmail1" class="form-label">Name</label> <input type="email" class="form-control" name="name"> </div> <div class="mb-3"> <label for="exampleInputEmail1" class="form-label">Username</label> <input type="text" class="form-control" name="username"> <div id="emailHelp" class="form-text">We'll never share your username anyone!</div> </div> <div class="mb-3"> <label for="exampleInputPassword1" class="form-label">Password</label> <input type="password" class="form-control" name="password"> </div> <p id="msg"></p> <button type="button" class="btn btn-primary">Sig Up</button> </form> </div>
This sending post from ajax jquery get data from :
<script type="text/javascript">
$(document).ready(function(){
$("#sigup").click(function(){
var data = document.getElementById('sigup');
var formData = new FormData(data);
console.log(JSON.stringify(Object.fromEntries(formData)));
$.ajax({
method: "POST",
url: "<?=base_url('user/register');?>",
data:JSON.stringify(Object.fromEntries(formData)),
contentType: "application/json",
success: function(res){ // respon db, if OK
if(res==1){
msg_('<font color=green> Add succesfully.</font>');
$('#sigup')[0].reset();
console.log(res);
}else{
msg_('<font color=red>'+res+'</font>');
console.log(res);
}
},
error: function(res){ // respon ajax, jquery before controller
console.log(res);
}
});// you have missed this bracket
});
});
</script>
Get more example, ajax jquery post + PHP : stack overflow.