POST Ajax Jquery Form Data Json

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.

READ :  Post Ajax JQuery Upload Image, File PHP
Topic : Web | Tags : , , , , , ,

Author : Andreas

Publisher konten yang berfokus pada topik spa massage, teknologi, bisnis online, dan digital. Ia aktif membuat artikel informatif yang membantu pembaca memahami tren terbaru secara lebih jelas dan mudah dipahami.

Editor : Team SEOSatu

Team SEOSatu bertanggung jawab atas proses penyuntingan, verifikasi, dan optimasi SEO pada setiap artikel. Tim memastikan konten yang dipublikasikan akurat, relevan, dan sesuai standar kualitas SEO.