Ajax 向数据库修改和添加功能(较简答) - 网站

Ajax 向数据库修改和添加功能(较简答)

分类:js_jQuery答疑 - 常见问题 · 发布时间:2021-10-17 04:08 · 阅读:6908

这篇文章主要介绍了Ajax 向数据库修改和添加功能(较简答),非常不错,具有参考借鉴价值,需要的朋友可以参考下

修改和添加关于数据库的信息,可以用于任何的添加和修改这些数据库和前面的随笔数据库是一样的

一、显示出数据库中的信息

(1)显示的效果也可以是用bootstrap的标签页显示(前面一定要引入bootstrap)

二、修改内容

 (1)标题显示之后,就是每一个标题中的内容了,可以用ajax遍历

 

(2)进行数据库遍历

 $.ajax({ url:"mianlei.php", //编写处理页面 dataType:"TEXT", success: function(d){ var hang = d.split("|"); //拆分字符“|”串:显示行 var str = ""; for(var i=0;i "; }   $("#mian").html(str); //把遍历的内容写在上面的 } }) 

(3)处理页面的编写如下

 StrQuery($sql); //输出结果

(4)然后进行修改的内容可以用模态框

   

(5)修改的时候,里面要默认显示原来的名字和价格,所以要将前面遍历的代号传过来

 $(".aa1").click(function(){ var code = $(this).attr("code"); //找到code值 $.ajax({ url:"xiugaichuli.php", //编写处理页面 data:{c:code}, //将code值传过去 type:"POST", dataType:"TEXT", success: function(d){ var hang = d.split("|"); //拆分字符“|”串:显示行 var str = ""; for(var i=0;i

价格:
"; } $("#content").html(str); //写入模态框中的content的位置 } }) })

(6)单击提交按钮后写入数据库,并且这里也修改了,单击提交按钮进行修改

 $("#tijiao").click(function(){ var code = $(".name").attr("code"); //找到名称中的代号 var code = $(".price").attr("code"); //找到价格的代号 var name = $(".name").val(); //找到名称的值 var price = $(".price").val(); //找到价格的值 $.ajax({ url:"tjsk.php", //处理页面的编写 data:{n:name,p:price,c:code}, //将值传到处理页面 type:"POST", dataType:"TEXT", success: function(data){ ///处理页面成功后输出 if(data.trim()=="ok") {   alert("修改成功!"); } } }) }) 

         

三、添加内容

(1)同上面的写一个弹框,里面有文本框

 
添加菜品

(2)填写信息后,单击提交按钮写入数据库

 $("#tijiao1").click(function(){ var n = $("#ming").val(); //找到名称文本框的值 j = $("#jia").val(); //找到价格文本框的值 $.ajax({ url:"tianjia.php", //编写处理页面 data:{n:n,j:j}, //将值传过去 type:"POST", dataType:"TEXT", success: function(d){ if(d.trim()=="ok") {   alert ("添加成功!"); }    window.location.href="xiugaicanpin.php" rel="external nofollow" ; }     }) })  

(3)处理页面的编写

 Query($sql); foreach($attr as $v) { $c = $v[0]+1; //使最大值加1 $sqll = " insert into caidan values('{$j}','{$c}','{$n}','1101','','','')"; //写入数据库 $db->Query($sqll,0); echo "ok"; } ?>

(4)添加结束后看下结果

到此,结束了,简单的添加和修改的功能,后面还要增加删除功能~~

以上所述是小编给大家介绍的Ajax 向数据库修改和添加功能(较简答),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对html中文网网站的支持!

标签:
ajax 修改 添加

相关文章

AJAX乱码与异步同步以及封装jQuery库实现步骤详解

这篇文章主要介绍了异步通信技术AJAX乱码问题、异步与同步、手动封装一个jQuery库,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习吧

AJAX的跨域问题解决方案

跨域简单的说,就是从一个域名的网页去访问另一个域名网页的资源,下面这篇文章主要给大家介绍了关于AJAX的跨域问题解决的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

利用Ajax实现智能回答的机器人示例代码

这篇文章主要介绍了利用Ajax实现智能回答的机器人,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

ajax、axios和fetch之间优缺点重点对比总结

今天被问到用没用过ajax axios,我回答经常用axios,但ajax用的比较少,下面这篇文章主要给大家介绍了关于ajax、axios和fetch之间优缺点重点对比总结的相关资料,需要的朋友可以参考下

如何通过axios发起Ajax请求(最新推荐)

Axios是专注于网络数据请求的库,相比于原生的XMLHttpRequest对象,axios简单易用。相比于Jquery,axios更加轻量化,只专注于网络数据请求,这篇文章主要介绍了如何通过axios发起Ajax请求,需要的朋友可以参考下

返回分类 返回首页