如何利用ajax提交form表单到数据库-创新互联

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

在南明等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供网站建设、网站设计 网站设计制作按需求定制网站,公司网站建设,企业网站建设,高端网站设计,营销型网站,外贸网站建设,南明网站建设费用合理。

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



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


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

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


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

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

index.html


这个页面由两个部分组成


1、表单控件


2、jQuery+ajax处理脚本


jQuery脚本会获取form表单的数据,通过post的方式提交给api.php




 login test
 
 
 
  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

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


数据库名为test,表名为testdata

下面是数据库截图

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

到此,本次案例完成。


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


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

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


当前题目:如何利用ajax提交form表单到数据库-创新互联
文章位置:http://pwwzsj.com/article/dhoceg.html

其他资讯