웹프로그래밍

Global It Leader!!


jQuery


 
 

jQuery Ajax serialize form data example

페이지 정보

작성자 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 1,099회 작성일 22-03-26 15:46

본문

Database Table

To store the form data in back-end, we must have a database. In this article, we have used the MySQL database.

So, let's first create a database name 'demo' in MySQL and a table name 'user_form' using the following MySQL statement. You can either use your existing database or copy paste the following command in your database.

CREATE TABLE IF NOT EXISTS `user_form` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(100) NOT NULL,
  `email` varchar(100) NOT NULL,
  `message` varchar(100) NOT NULL,
  PRIMARY KEY (`id`)
)


 

index.php

Next, create a simple form 'index.php' to get information from user. This form contains all the fields that the user_form table has. In this, we have included jQuery and Bootstrap libraries.

upload.php

Here is the PHP script of "upload.php" file, which simply retrieve and insert the form values submitted by the user.

<?php 

$conn = mysqli_connect("localhost", "root", "", "demo");  
if(isset($_POST["name"]))  
{  
	$name = mysqli_real_escape_string($conn, $_POST["name"]); 
	$email = mysqli_real_escape_string($conn, $_POST["email"]);  	
	$message = mysqli_real_escape_string($conn, $_POST["message"]);  
	$query = "INSERT INTO user_form(name, email, message) VALUES ('".$name."','".$email."','".$message."')";  
	if(mysqli_query($conn, $query))  
	{  
	   echo '<p>You have entered</p>';  
	   echo '<p>Name:'.$name.'</p>';  
	   echo '<p>Email:'.$email.'</p>';  
	   echo '<p>Message : '.$message.'</p>';  
	}  
}  
?>

The above code will produce the following result -

<!DOCTYPE html>  
<html>
	<head>
		<title>jQuery Ajax serialize form data example</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
                <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>  
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"><

댓글목록

등록된 댓글이 없습니다.

전체 142
게시물 검색
jQuery 목록
번호 제목 글쓴이 조회 날짜
142 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 249 07-06
141 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 476 01-05
140 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 546 12-07
139 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1074 03-31
138 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1082 03-28
137 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1070 03-27
136 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1325 03-27
135 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1058 03-27
134 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1087 03-27
133 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1330 03-26
132 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1091 03-26
131 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1198 03-26
130 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2231 03-26
129 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1666 03-26
128 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1250 03-26
127 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1451 03-26
126 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1648 03-26
열람중 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1100 03-26
124 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1059 03-26
123 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1183 03-26