用ajax提交表单给数据库,如何利用ajax提交form表单到数据库

如何利用ajax提交form表单到数据库

发布时间：2021-06-17 14:52:49

来源：亿速云

阅读：75

作者：小新

这篇文章主要介绍如何利用ajax提交form表单到数据库，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

大家应该都知道，在静态页面提交表单到数据库很简单就是单纯的

这个缺点是会刷新页面，会跳转页面的。

今天给大家带来的技术就是ajax提交表单

优点是不刷新页面，不跳转页面，静默提交的。

至于什么是ajax，自己去百度了解。

首先我们得要有一个表单提交页面：

index.html

这个页面由两个部分组成

1、表单控件

2、jQuery+ajax处理脚本

jQuery脚本会获取form表单的数据，通过post的方式提交给api.phpHTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

function insert() {

$.ajax({

type: "POST",//方法

url: "api.php" ,//表单接收url

data: $('#form1').serialize(),

success: function () {

//提交成功的提示词或者其他反馈代码

var result=document.getElementById("success");

result.innerHTML="成功!";

error : function() {

//提交失败的提示词或者其他反馈代码

var result=document.getElementById("success");

result.innerHTML="失败!";

}

});

}

下面就是表单接收页面

api.php

该页面其实很简单

就是连接数据库

然后插入数据库

插入数据库的两个值为

title和url<?php

$title = $_POST['title'];

$url = $_POST['url'];

$con = mysql_connect("localhost","root","root");

if (!$con)

{

die('Could not connect: ' . mysql_error());

}

mysql_select_db("test", $con);

mysql_query("INSERT INTO testdata (title, url)

VALUES ('$title', '$url')");

mysql_close($con);

然后我们需要建立好一个数据库

数据库名为test，表名为testdata

下面是数据库截图

到此，本次案例完成。

当然上面的代码只是简单的实现了ajax提交form表单

但是还有很多细节需要优化，例如表单验证，数据加密等，可以自己拓展学习，完善。

以上是“如何利用ajax提交form表单到数据库”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注亿速云行业资讯频道！

用ajax提交表单给数据库,如何利用ajax提交form表单到数据库相关推荐

表单php跳转页面跳转,form表单页面跳转方式提交练习
该楼层疑似违规已被系统折叠隐藏此楼查看此楼 //form表单提交练习 /*新建一个form.html网页用来书写前端HTML表单*/ 表单提交练习姓名: 年龄: 电话: 地址: QQ: 自我评价: ...
html表单的常用属性有哪些,html/form表单常用属性认识
1.form表单常用属性练习 .form1 { margin: auto; height: 900px; width: 500px; text-align: center; line-height: ...
php中enctype属性,PHP_关于form表单中Enctype属性的用法，关于Form表单中Enctype属性的用 - phpStudy...
关于form表单中Enctype属性的用法关于Form表单中Enctype属性的用法: form表单中的Enctype属性指定将数据发回到服务器时浏览器使用的编码类型. 下面是它的取值说明: mul ...
html表单注册功能的实现,仅一个form表单 js实现注册信息依次填写提交功能
function one() { if (confirm("确定提交?")) { $("#one").hide(); $("#two").s ...
ajax表单排序java,java如何区分是form表单请求，还是ajax请求
对Live Writer支持的继续改进:设置随笔地址别名(EntryName) 在我们发布[功能改进]Live Writer发博支持"建分类.加标签.写摘要"之后,Artech提了 ...
android微信post提交表单,微信自带浏览器不支持form表单post提交方案解决
opencart 引入 TWIG 模板引擎 1.首先将 twig 包放入 system\library 目录. 2.在 system/startup.php 文件最后添加引入语句. require_o ...
html表单action属性值,HTML中的form表单中的action属性
用户提问在一本书中,在一个处理用户注册的html里,作者把action的值设为"regist.jsp",如下: function on_submit() { if (form1. ...
数据库学习之MySQL (三）——数据库小试牛刀 + 利用对象思维理解表行列
文章目录前言 ´･ᴗ･` 获得自己第一个数据库执行代码小试牛刀简单语句的实验方法表的理解总结 ´◡` 前言 ´･ᴗ･` 本文我们将通过运行sql代码得到自己的第一个数据库我们学习的重 ...
python股票数据库_利用Python爬股票数据并存入数据库Mysql
直接上代码,小白也能爬股票......... import tushare as ts import mysql.connector import re,time #创建所有股票的表格以及插入每支股票 ...

用ajax提交表单给数据库,如何利用ajax提交form表单到数据库

用ajax提交表单给数据库,如何利用ajax提交form表单到数据库相关推荐

最新文章

热门文章