웹프로그래밍

Global It Leader!!


jQuery


 
 

jQuery Ajax serialize form data example

페이지 정보

작성자 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 1,544회 작성일 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 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 95 12-27
148 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 204 11-08
147 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 228 07-31
146 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 222 06-20
145 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 215 06-20
144 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 219 06-05
143 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 217 06-05
142 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 707 07-06
141 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 896 01-05
140 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1002 12-07
139 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1517 03-31
138 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1526 03-28
137 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1522 03-27
136 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2247 03-27
135 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1485 03-27
134 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1567 03-27
133 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1885 03-26
132 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1516 03-26
131 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1719 03-26
130 no_profile 운영자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 3264 03-26