웹프로그래밍

Global It Leader!!


jQuery


 
 

jQuery Ajax serialize form data example

페이지 정보

작성자 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 1,304회 작성일 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 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 427 07-06
141 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 650 01-05
140 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 752 12-07
139 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1274 03-31
138 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1277 03-28
137 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1264 03-27
136 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1738 03-27
135 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1259 03-27
134 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1303 03-27
133 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1576 03-26
132 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1283 03-26
131 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1439 03-26
130 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2757 03-26
129 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1915 03-26
128 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1478 03-26
127 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1649 03-26
126 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1902 03-26
열람중 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1305 03-26
124 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1230 03-26
123 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1391 03-26