ajax 实现修改功能
这段时间在做项目,发现自己忘得好快呀,幸亏有博客园帮我记着呢,整理博客园简直不要太重要了哦
因为做的是一个内部管理系统,只用了一个主页面,所有的都不允许整个网页刷新,所以我们只能用ajax
来做,当然刚开始做也走了很多的弯路,最终还是做出来了 这点还是比较欣慰的
今天要整理一下ajax实现修改功能 这里的login登录也不写了,主要是写一下修改的大体代码,方便以后
用的时候查找
样式我用的是bootstrap,一开始要引入三个文件,这里就不多说了,下面是页面所要显示的样式
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">修改</h4>
</div> <div class="modal-body">
<?php
$sql="select * from qxcg ";
$arr=$db->Query($sql);
foreach($arr as $v)
{ $sqn = "select qxmc from qxypmx where qxdh='{$v[1]}'";
$att = $db->Query($sqn); $squ = "select uid from login where num='{$v[4]}'";
$ann = $db->Query($squ);
}
?>
器械名称: <input type="text" value="<?php echo $att[0][0]; ?>" id="rmc"/><br/><br>
采购数量:<input type="text" value="<?php echo $v[2]; ?>" id="rsl"/><br/><br/>
采购日期:<input type="text" value="<?php echo $v[3]; ?>" id="rqi"/><br/><br/>
采购员:<input type="text" readonly="readonly" value="<?php echo $ann[0][0]; ?>" id="rcg"/> </div> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" id="rcbtn">保存</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal -->
</div>
</div>
当然看到这个地方,还要有一个修改的按钮 需点击后触发事件
<input type='button' class='xiugai' value='修改'
data-toggle='modal' data-target='#myModal2' ids0='{$v[0]}' ids1='{$att[0][0]}'
ids2='{$v[2]}' ids3='{$v[3]}' ids4='{$ann[0][0]}'/> //这里面的值是通过php代码求出来的,这里就不多说了
下面是ajax部分了 为了方便,我把修改写成了一个方法,用到的时候直接调用就可以了
function xiugai()
{
var ids = ""; //首先定义为空
var rmc1= "";
var rsl1= "";
var rqi1= "";
var rcg1= "";
$(".xiugai").click(function() { //给修改按钮一个点击事件
ids = $(this).attr("ids0"); rmc1= $(this).attr("ids1"); //把之前有的值取出来,赋值给表单的val
rsl1= $(this).attr("ids2");
rqi1= $(this).attr("ids3");
rcg1= $(this).attr("ids4"); $("#rmc").val(rmc1);
$("#rsl").val(rsl1);
$("#rqi").val(rqi1);
$("#rcg").val(rcg1); $("#rcbtn").click(function(){
var rmc=$("#rmc").val();
var rsl=$("#rsl").val();
var rqi=$("#rqi").val();
var rcg=$("#rcg").val(); $.ajax({
url:"xiugai.php",
data:{ids:ids,rmc:rmc,rsl:rsl,rqi:rqi},
type:"POST",
dataType:"TEXT",
success:function(xx){
//alert(xx);
if(xx.trim()=="OK")
{
alert("修改成功");
Load();
} }
})
$('#myModal2').modal('hide')
})
});
}
<?php
$ids=$_POST["ids"];
$rmc=$_POST["rmc"];
$cgsl=$_POST["rsl"];
$cgrq=$_POST["rqi"]; include("DBDA.class.php");
$db=new DBDA(); $sql1="select qxdh from qxypmx where qxmc='{$rmc}'";
$arr=$db->Query($sql1); $sql="update qxcg set qxdh='{$arr[0][0]}',cgsl='{$cgsl}',cgrq='{$cgrq}' where ids='{$ids}'"; if($db->Query($sql,0))
{
echo"OK";
}
else
{
echo"NO";
}
这样就可以实现修改按钮的功能了 点击修改之后有个弹出框,如图所示:
修改后点击保存,弹出框消失,内容保存就Ok了
ajax 实现修改功能的更多相关文章
- JAVAEE——BOS物流项目04:学习计划、datagrid、分页查询、批量删除、修改功能
1 学习计划 1.datagrid使用方法(重要) n 将静态HTML渲染为datagrid样式 n 发送ajax请求获取json数据创建datagrid n 使用easyUI提供的API创建data ...
- BBS-基于forms组件和ajax实现注册功能
http://www.cnblogs.com/yuanchenqi/articles/7638956.html 1.设计注册页面 views.py from django import forms c ...
- 3- 功能2:基于forms组件和ajax实现注册功能
1.forms组件的注册页面 url from django.urls import path, re_path from blog import views from django.views.st ...
- php大力力 [052节] php数据库页面修改功能
php大力力 [052节] php数据库页面修改功能
- ajax实现下载功能
ajax实现下载功能 适用场景:由于点击按钮下载excel响应时间过长,此时间段加入加载样式(灰色层.加载动画): 浏览器弹出下载框后,上面的加载样式去掉. 方 法 :使用jquery.fi ...
- 利用 FormData 对象和 Spring MVC 配合可以实现Ajax文件上载功能
Ajax文件上载 利用 FormData 对象和 Spring MVC 配合可以实现Ajax文件上载功能: 步骤 导入组件并准备静态脚本 <dependency> <groupId& ...
- SpringMVC由浅入深day01_9商品修改功能开发
9 商品修改功能开发 9.1 需求 操作流程: 1.进入商品查询列表页面 2.点击修改,进入商品修改页面,页面中显示了要修改的商品(从数据库查询) 要修改的商品从数据库查询,根据商品id(主键)查询商 ...
- 系统管理模块_岗位管理_改进_使用ModelDroven方案_套用美工写好的页面效果_添加功能与修改功能使用同一个页面
改进_使用ModelDroven方案 @Controller @Scope("prototype") public class RoleAction extends ActionS ...
- 如何使Label有修改功能
如何使Label有修改功能 之前制作一个项目时需要这样一个功能: 双击Label, 随后Label变为TextBox,用户修改后回车,TextBox变回Label 之前使用WPF做了一个,代码如下: ...
随机推荐
- oracle 随笔
oracle分页 select * from (select a1.*, rownum rn from (select *from emp) a1 where rownum<=10) where ...
- Ancient Cipher UVa1339
这题就真的想刘汝佳说的那样,真的需要想象力,一开始还不明白一一映射是什么意思,到底是有顺序的映射?还是没顺序的映射? 答案是没顺序的映射,只要与26个字母一一映射就行 下面给出代码 //Uva1339 ...
- SerfJ REST
SerfJ提供了一个MVC架构,但它不包含任何模型,其主要特点是使用控制器collerlor,通过这些collerlor管理REST请求.可帮助你开发优雅的MVC架构的应用,使用惯例重于配置的思路,无 ...
- linux 下apache2 安装
Apache安装要求 安装APR.APR-Util.PCRE,gcc-c++等包 Apache HTTP Server http://httpd.apache.org/download.cgi#ap ...
- SqlHelper帮助类_上(SQLServer数据库含Connection详解)
在操作数据库时,经常会用到自己封装的SqlHelper.这里主要对SQLServer数据库的Sqlhelper,主要用于在同一个连接中完成CRUD! 一.ADO.NET中的Connection详解: ...
- [转载]解决win10 VC++6.0 应用程序无法正常运行 0xc0000142
本文转载自http://blog.csdn.net/w_9449/article/details/52864135 转载请申明哦,其实我发现自从我在贴吧发了帖子后,就冒出了不少帖子.经验.当然方法和我 ...
- Lambda&Java多核编程-5-函数式接口与function包
从前面的总结中我们知道Lambda的使用场景是实现一个函数式接口,那么本篇就将阐述一下何为函数式接口以及Java的function包中提供的几种函数原型. 函数式接口 早期也叫作SAM(Single ...
- 关于利用input的file属性在页面添加图片的问题
在页面添加图片涉及到兼容的问题怎么解决兼容问题呢?请看下面分析: 在IE浏览器上面我们能直接通过获取其input的value值来获取其图片的路径. 在火狐和谷歌需要用createObjectURL(( ...
- C++primer拾遗(第二章:变量和基本类型)
这是我对c++primer第二章的一个整理总结,算是比较适用于我自己吧,一小部分感觉不用提及的就省略了,只提了一下平时不注意,或者不好记住的内容. 排版太费劲了,直接放了图片格式.从自己的oneNot ...
- Thrift序列化与反序列化的实现机制分析
Thrift是如何实现序死化与反序列化的,在IDL文件中,更改IDL文件中的变量序号或者[使用默认序号的情况下,新增变量时,将新增的变量不放在IDL文件的结尾,均会导致Thrift文件的反序列后无法做 ...