Insert Record From

<div class="col-xs-12 col-sm-12">			   
   			 	<h3>Regestration Form</h3>
                  <form method="post" action=""> 
                  <input type="hidden" name="id" value="" class="form-control">
                  <input type="hidden" name="action" value="" class="form-control">
                  
                  <div class="row">   
                    <div class="col-xs-12 col-sm-3"><label>Name</label>
						<input type="text" id="studentname" name="studentname" value="" class="form-control">
                    </div>
                  	<div class="col-xs-12 col-sm-3"><label>Class</label>
                    	<input type="text" id="studentclass" name="class" value="" class="form-control">
                    </div>
					<div class="col-xs-12 col-sm-4"><label>Address</label>
                    	<input type="text" id="studentaddress" name="address" value="" class="form-control">
					</div>
                    <div class="col-xs-12 col-sm-1"><label>&nbsp;</label>
                    	<input type="button" id="addrecord" class="btn btn-primary form-control" value="Add">
                    </div>
                  </div>
                  </form>
        	</div> 

Display Record

<div class="col-xs-12 col-sm-12">
       <h3>Student record</h3>
                <table class="table table-bordered ">
                    <tr class="table-active">
                        <th>Name</th>
                        <th>Class</th>
                        <th>Address</th>
                        <th style="width:180px;">Control</th>
                    </tr>
                    <?php  
                     $sqlp =mysql_query("select * from  tbl_student order by id desc") or die(mysql_error());
                     if(mysql_num_rows($sqlp)){
                    while($rowp=mysql_fetch_assoc($sqlp)){ 
                    extract($rowp)?>
                    <tr id="row<?php echo $id ?>">
                        <td><div id="rowname<?php echo $id ?>"> <?php echo $name ?></div></td>
                        <td><div id="rowclass<?php echo $id ?>"><?php echo $class ?></div></td>
                        <td><div id="rowaddress<?php echo $id ?>"><?php echo $address ?></div></td>
                        <td><!--<a class="btn btn-success" href="index.php">Add</a>-->
                        <a 	class="btn btn-primary getupdateid"  
                            id="<?php echo $id ?>" 
                            name="<?php echo $name ?>"
                            studentclass="<?php echo $class ?>"
                            address="<?php echo $address ?>" > Edit</a>
                           <a 	class="btn btn-success getsaveid" style="display:none;" 
                            id="save<?php echo $id ?>" 
                            uid="<?php echo $id ?>" > Save</a>
                        <a class="btn btn-warning deleterecord" rowid="<?php echo $id ?>" > Delete</a></td>
                    </tr>
                    <?php }}else{
                        echo "no record";
                    }?>
                </table>
</div>

Add Record In Jquery Function 

$( "#addrecord" ).click(function () {
			var name=$("#studentname").val();
			var studentclass=$("#studentclass").val();
			var address=$("#studentaddress").val();
			/*------------------call ajax for Add record--------------------------*/
			$.ajax({
				type: "POST",
				url: "query.php",
				data: "action=add&name="+ name+"&class="+ studentclass+"&address="+ address,
				success: function(retunrmsg){
				alert(retunrmsg);
				window.location.href="edit-ajax.php";
				/*---------------------*/
				$("#studentname").val('');
				$("#studentclass").val('');
				$("#studentaddress").val('');
				/*-----------------------*/
				}
			});	
			/*------------------call ajax for Add record--------------------------*/
});

Update Record In Jquery Function 

$( ".getupdateid" ).click(function () {
	
		var currentRecordID=$(this).attr('id')
		var currentName=$(this).attr('name')
		var currentClass=$(this).attr('studentclass')
		var currentAddress=$(this).attr('address')
		$("#rowname"+currentRecordID).html('<input class="form-control" type="text" value="'+currentName+'" id="txtname'+currentRecordID+'" >')
		$("#rowclass"+currentRecordID).html('<input class="form-control" type="text" value="'+currentClass+'" id="txtclass'+currentRecordID+'" >')
		$("#rowaddress"+currentRecordID).html('<input class="form-control" type="text" value="'+currentAddress+'" id="txtaddress'+currentRecordID+'" >')
		$(this).hide()
		$("#save"+currentRecordID).show()
	});
	
	$( ".getsaveid" ).click(function () {
		var currentRecordID=$(this).attr('uid')
		var currentName=$("#txtname"+currentRecordID).val()
		var currentClass=$("#txtclass"+currentRecordID).val()
		var currentAddress=$("#txtaddress"+currentRecordID).val()
		$("#rowname"+currentRecordID).html(currentName);
		$("#rowclass"+currentRecordID).html(currentClass);
		$("#rowaddress"+currentRecordID).html(currentAddress);
		$(this).hide()
		$("#"+currentRecordID).show()
				$("#"+currentRecordID).show()
		/*------------------call ajax for edit record--------------------------*/
		$.ajax({
				type: "POST",
				url: "query.php",
				data: "action=edit&id="+ currentRecordID+"&name="+ currentName+"&class="+ currentClass+"&address="+ currentAddress,
				success: function(retunrmsg){
				alert(retunrmsg);
			}
		});	
		/*---------------------------------------------*/
		
});

Delete Record In Jquery Function 

$( ".deleterecord" ).click(function () {
		var idd=$(this).attr('rowid');
		
		/*------------------call ajax for Add record--------------------------*/
		var checkstr =  confirm('Are you sure you want to delete this?');
    	if(checkstr == true){
				$.ajax({
						type: "POST",
						url: "query.php",
						data: "action=delete&id="+ idd,
						success: function(retunrmsg){
						alert(retunrmsg);
						window.location.href="edit-ajax.php";
					}
				});	
		 }else{
   			 return false;
    	}
		/*------------------call ajax for Add record--------------------------*/
		
	});

Add Record In PHP Function 

function add()
{
	//echo "here";
	
	$name 				= $_POST['name'];
	$class			 	= $_POST['class'];
	$address			= $_POST['address'];
	$sql = "insert into tbl_student(name, class,address) values('$name','$class','$address')";
	if(mysql_query($sql) or die(mysql_error()))
	{
		echo "success";
	}
	else
	{
		echo "fail";
	}
}

Edit Record In PHP Function 

function edit()
{
	$id 				= $_POST['id'];
	$name 				= $_POST['name'];
	$class			 	= $_POST['class'];
	$address			= $_POST['address'];
	$sqli = mysql_query("update tbl_student set  
	name = '$name',
	class = '$class',
	address = '$address'  where id = '$id'") or die(mysql_error());
	if(mysql_affected_rows() >0)
	{
		echo "success";
	}
	else
	{
		echo "you have already saved";
	}
}

Delete Record In PHP Function

function delete()
{
	 $id =isset($_POST['id'])? $_POST['id'] : "";
	
	
	$sql = mysql_query("START TRANSACTION");
	$del =	"delete from tbl_student where id = '$id'";
	if(mysql_query($del) or die(mysql_error()))
	{
		mysql_query("COMMIT");
		echo "record has benn deleted";
	}
	else
	{
		mysql_query("ROLLBACK");
    	echo "Try Agail";
	}
}

 

Download demo

If love this tutorial Please Like this page