热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

mysql-怎么用jQuery、Ajax、php实现这样的无刷新编辑功能?

先放我做好的效果图。如下图1为编辑前的效果,图2为点击“修改库存”后的效果。html和CSS已经弄出来了,但不懂javascript。修改后的数据直接通过后台php修改到mysql,若成功则直接返回数据到库存的td单元格。然后...

先放我做好的效果图。如下图1为编辑前的效果,图2为点击“修改库存”后的效果。html和CSS已经弄出来了,但不懂Javascript。修改后的数据直接通过后台php修改到mysql,若成功则直接返回数据到库存的td单元格。

然后是我的html代码。


    
    3308
    3.97 M³
    2950.00 元
    2013-05-21 14:36:20
    
    保存修改

求兄弟们能给个详细点的答案,实在是不懂Javascript啊,整个页面就差这一个功能实现了。另外,这样的表格有长长一列,我可以用php循环生成动态html标签id的。

感谢感谢!

回复内容:

先放我做好的效果图。如下图1为编辑前的效果,图2为点击“修改库存”后的效果。html和CSS已经弄出来了,但不懂Javascript。修改后的数据直接通过后台php修改到mysql,若成功则直接返回数据到库存的td单元格。

然后是我的html代码。


    
    3308
    3.97 M³
    2950.00 元
    2013-05-21 14:36:20
    
    保存修改

求兄弟们能给个详细点的答案,实在是不懂Javascript啊,整个页面就差这一个功能实现了。另外,这样的表格有长长一列,我可以用php循环生成动态html标签id的。

感谢感谢!

上面回答的,我没有采纳答案,实在是我水平有限,没有修改好。在php100也同提了这个问题,很快得到解决。下面贴上php100的答案,并附上链接,方便他人。










3308 3.97 M3 2950.00 2013-05-21 14:36:20 库存 0 套 修改库存
3308 3.97 M3 2950.00 2013-05-21 14:36:20 库存 0 套 修改库存

上面是html页面,下面是php

 '错误!',
    'status' => FALSE,
    'num' => 0
);
if(isset($_POST['id']) && isset($_POST['num'])){
    if(is_numeric($_POST['id']) && is_numeric($_POST['num'])){
        $id = (int)$_POST['id'];
        $num = (int)$_POST['num'];
        $r['msg'] = '修改成功!';
        $r['num'] = $num;
        $r['status'] = TRUE;
    }else{
        $r['msg'] = '错误![2]';
    }
}else{
    $r['msg'] = '错误![1]';
}

echo json_encode($r);
?>

$(document).ready(function() {
//为每一个具有相同id=cartUpdate 的 添加click事件
$("#cartUpdate").live("click",function(){
    var text=$(this).text();
    if(text=="修改数量"){
        var count = $(this).parent().prev().text();
        $(this).parent().prev().html("");
        $(this).text("确定");
    }else if(text=="确定"){
        var count2 = $(this).parent().prev().children().val();
        var id = $(this).parent().prev().prev().prev().prev().text();
        $.post("/cart/update", {
            "productId" : id,"count":count2
        }, function(data) {
            if(data=="ok"){
                $("#p" + id).next().next().next().text(count2);
                $("#p" + id).nextAll().find("button").text("修改数量");
            }else{
                alert("修改失败");
            }
        });
    }
});

推荐阅读
  • 在说Hibernate映射前,我们先来了解下对象关系映射ORM。ORM的实现思想就是将关系数据库中表的数据映射成对象,以对象的形式展现。这样开发人员就可以把对数据库的操作转化为对 ... [详细]
  • 本文介绍了在SpringBoot中集成thymeleaf前端模版的配置步骤,包括在application.properties配置文件中添加thymeleaf的配置信息,引入thymeleaf的jar包,以及创建PageController并添加index方法。 ... [详细]
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
  • VScode格式化文档换行或不换行的设置方法
    本文介绍了在VScode中设置格式化文档换行或不换行的方法,包括使用插件和修改settings.json文件的内容。详细步骤为:找到settings.json文件,将其中的代码替换为指定的代码。 ... [详细]
  • 本文介绍了在开发Android新闻App时,搭建本地服务器的步骤。通过使用XAMPP软件,可以一键式搭建起开发环境,包括Apache、MySQL、PHP、PERL。在本地服务器上新建数据库和表,并设置相应的属性。最后,给出了创建new表的SQL语句。这个教程适合初学者参考。 ... [详细]
  • Java实战之电影在线观看系统的实现
    本文介绍了Java实战之电影在线观看系统的实现过程。首先对项目进行了简述,然后展示了系统的效果图。接着介绍了系统的核心代码,包括后台用户管理控制器、电影管理控制器和前台电影控制器。最后对项目的环境配置和使用的技术进行了说明,包括JSP、Spring、SpringMVC、MyBatis、html、css、JavaScript、JQuery、Ajax、layui和maven等。 ... [详细]
  • 本文讨论了Alink回归预测的不完善问题,指出目前主要针对Python做案例,对其他语言支持不足。同时介绍了pom.xml文件的基本结构和使用方法,以及Maven的相关知识。最后,对Alink回归预测的未来发展提出了期待。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • Java验证码——kaptcha的使用配置及样式
    本文介绍了如何使用kaptcha库来实现Java验证码的配置和样式设置,包括pom.xml的依赖配置和web.xml中servlet的配置。 ... [详细]
  • Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]
  • 本文介绍了使用cacti监控mssql 2005运行资源情况的操作步骤,包括安装必要的工具和驱动,测试mssql的连接,配置监控脚本等。通过php连接mssql来获取SQL 2005性能计算器的值,实现对mssql的监控。详细的操作步骤和代码请参考附件。 ... [详细]
  • 在Android中解析Gson解析json数据是很方便快捷的,可以直接将json数据解析成java对象或者集合。使用Gson解析json成对象时,默认将json里对应字段的值解析到java对象里对应字段的属性里面。然而,当我们自己定义的java对象里的属性名与json里的字段名不一样时,我们可以使用@SerializedName注解来将对象里的属性跟json里字段对应值匹配起来。本文介绍了使用@SerializedName注解解析json数据的方法,并给出了具体的使用示例。 ... [详细]
  • 本文介绍了如何使用jQuery和AJAX来实现动态更新两个div的方法。通过调用PHP文件并返回JSON字符串,可以将不同的文本分别插入到两个div中,从而实现页面的动态更新。 ... [详细]
  • express工程中的json调用方法
    本文介绍了在express工程中如何调用json数据,包括建立app.js文件、创建数据接口以及获取全部数据和typeid为1的数据的方法。 ... [详细]
  • Jquery 跨域问题
    为什么80%的码农都做不了架构师?JQuery1.2后getJSON方法支持跨域读取json数据,原理是利用一个叫做jsonp的概念。当然 ... [详细]
author-avatar
四-没-之-女
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有