웹프로그래밍

Global It Leader!!


jQuery


 
 

jQuery Ajax serialize form data example

페이지 정보

작성자 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 1,539회 작성일 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"><

댓글목록

등록된 댓글이 없습니다.

전체 149
게시물 검색
jQuery 목록
번호 제목 글쓴이 조회 날짜
149 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 91 12-27
148 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 201 11-08
147 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 221 07-31
146 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 219 06-20
145 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 209 06-20
144 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 212 06-05
143 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 214 06-05
142 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 703 07-06
141 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 892 01-05
140 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 997 12-07
139 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1512 03-31
138 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1520 03-28
137 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1520 03-27
136 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2236 03-27
135 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1482 03-27
134 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1565 03-27
133 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1878 03-26
132 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1511 03-26
131 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1708 03-26
130 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 3260 03-26