ajax 小练习
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="renderer" content="webkit">
<title>网站信息</title>
<link rel="stylesheet" href="../css/pintuer.css">
<link rel="stylesheet" href="../css/admin.css">
<script src="../js/jquery.js"></script>
<script src="../js/pintuer.js"></script>
</head>
<body>
<?php
session_start();
if(empty($_SESSION["uid"]))
{
header("location:../login.html");
exit; }
?>
<div class="panel admin-panel"> <table width="100%" border="" cellpadding="" cellspacing="" style="text-align:center">
<tr>
<td>栏目</td> <td>编辑</td>
<td>删除</td> </tr> <tbody id="bg"> </tbody> </table>
</div>
<br>
<div><input type="button" value="添加栏目" id="add"/></div>
<div class="add" >栏目名称:<input type="text" id="lm"/></div>
<div class="add" >类型:<input type="text" id="lx"/></div> <div class="add" ><input type="button" value="添加" id="tianjia"/></div>
<script type="text/javascript">
$(document).ready(function(e) { jiazai(); //添加栏目 $("#tianjia").click(function(){ var lm = $("#lm").val(),
lx=$("#lx").val(),
xh=$("#xh").val(); $.ajax({
url:"add.php",
data:{lm:lm,lx:lx,xh:xh},
type:"POST",
dataType:"TEXT",
success:function(jia){
if(jia.trim()=="OK")
{
//重新加载
jiazai(); }
else
{
alert("添加失败");
}
}
}); }) function jiazai()
{ //调AJAX
$.ajax({
url:"lanmuchuli_hou.php",
type:"POST",
dataType:"TEXT",
success: function(data){
var hang = data.split("|");
var str=""; for(var i=;i<hang.length;i++) {
var lie = hang[i].split("^"); str += "<tr><td class='n'>"+lie[]+"</td><td><input type='button' value='修改' class='xiugai' code='"+lie[]+"' /></td><td><input type='button' value='删除' class='shanchu' code='"+lie[]+"' onclick='return del(1)' /></td></tr>"; }
$("#bg").html(str);
xiugai();//调用修改栏目方法
//删除栏目
$(".shanchu").click(function(){ var code = $(this).attr("code");
$.ajax({
url:"shanchu.php",
data:{c:code},
type:"POST",
dataType:"TEXT",
success: function(d){
if(d.trim()=="OK")
{
//重新加载
jiazai();
}
else
{
alert("删除失败");
}
}
});
}) }
});
} //修改栏目
function xiugai(){
$(".xiugai").click(function(){ var code = $(this).attr("code"); $.ajax({
type:"post",
url:"lanmuchuli_xiugai.php",
data:{code:code},
dataType:"TEXT",
success:function(r){
$("#bg").html(r); $("#lanmu_xiugai").click(function(){
var name = $("#lanmu_name").val();
$.ajax({
type:"post",
url:"xiugai.php",
data:{code:code,name:name},
success:function(j){
jiazai();
}
}); }) }
}); }) } }) </script>
</body> </html>
处理界面:
<?php
include("../DBDA.class.php");
$db = new DBDA();
$sql = " select * from lanmu ";
$attr = $db->StrQuery($sql);
echo $attr;
<?php
include("../DBDA.class.php");
$db = new DBDA();
$lm = $_POST["lm"];
$lx = $_POST["lx"]; $sql = "insert into lanmu values('{$lm}','{$lx}','','xiugai')";
$r=$db->Query($sql,);
if($r)
{
echo "OK";
}
else
{
echo "NO";
}
<?php
include("../DBDA.class.php");
$db = new DBDA();
$code = $_POST["c"];
$sql = "delete from lanmu where code='{$code}'";
$r = $db->Query($sql,);
if($r)
{
echo "OK";
}
else
{
echo "NO";
}
<?php
include("../DBDA.class.php");
$db = new DBDA();
$sql = "select * from lanmu";
$code=$_POST["code"];
$at = $db->Query($sql);
$str = "";
foreach($at as $v)
{
if($v[]==$code)
{
$str.="<tr><td class='n'><input type='text' id='lanmu_name' value='{$v[0]}'></td><td><input type='button' value='保存' id='lanmu_xiugai' code='{$v[2]}' /></td><td></td></tr>";
}
else
{
$str.="<tr><td class='n'>{$v[0]}</td><td><input type='button' value='修改' class='xiugai' code='{$v[2]}' /></td><td><input type='button' value='删除' class='shanchu' code='{$v[2]}' /></td></tr>";
} }
echo $str;
?>
<?php
include("../DBDA.class.php");
$db = new DBDA();
$code=$_POST["code"];
$name=$_POST["name"];
$sql = " update lanmu set name='{$name}' where code={$code}";
$db->Query($sql,);
?>


删除功能:
添加功能:


修改功能:


ajax 小练习的更多相关文章
- 第一个ajax小demo
第一个ajax小demo 文章来源:http://blog.csdn.net/magi1201/article/details/44569657
- AJAX 小实例(转摘)
最近老总提了一个小功能,在搜索网吧列表的时候加上网吧所属代理商这个条件,原有的搜索条件是一个地区二级联动,现在需要根据不同的地区显示不同的代理商集合.即在触发地区下拉框的onchange事件时,代理商 ...
- 自定义ajax小工具以及使用
function createXMLHttpRequest(){ try{ return new XMLHttpRequest(); }catch(e){ try{ return new Active ...
- AJAX小练习,防止以后忘记
<div id="content"> <input id="btnShow" type="button" value=&q ...
- 封装一个自己的 Ajax小框架
框架代码如下: // 使用封装方法的人只关心提供http的请求方法,url地址,数据,成功和失败的回调方法 // 类的构造定义,主要职责就是新建出 XMLHttpRequest 对象 var MyXM ...
- JavaScript实现拖拽预览,AJAX小文件上传
本地上传,提前预览(图片,视频) 1.html中div标签预览显示,button标签触发上传事件. <div id="drop_area" style="bord ...
- ajax 小案例
ajax 异步提交数据,实现无刷新提交表单 ajax.html <!DOCTYPE html> <html> <head> <meta charset=&qu ...
- Fetching data with Ajax小例子
ajax获取数据示例: 示例1 通过ajax获取txt文件里面的内容示例: <html> <head> <title>Ajax at work</title& ...
- 看到一个想收藏的的AJAX小列子
用户登录的验证可以使用 form 表单提交,也可以使用 ajax 技术异步提交. AJAX 即 Asynchronous Javascript And XML(异步 JavaScript 和 XML) ...
随机推荐
- [代码]--给任意网站添加聊天功能,随时聊(fa)天(che)
感谢“topurl.cn”制作此功能并分享. 这是一段代码,在打开的网页中使用,可以加载一个外挂形式的聊天室功能, 就可以和同样访问此网站进行相同操作的网友进行聊(fa)天(che)了. 使用方法: ...
- Ubuntu16.04安装使用wps
Ubuntu16.04安装使用wps 1.wps官网下载并安装wps 此处以Debian安装包为例,官网下载路径 http://www.wps.cn/product/wpslinux/# 直接安装: ...
- Let's Encrypt免费泛域名证书申请
一. 下载acme.sh,以下四条命令任选一条即可 curl https://get.acme.sh | shwget -O - https://get.acme.sh | sh curl https ...
- BZOJ2040[2009国家集训队]拯救Protoss的故乡——模拟费用流+线段树+树链剖分
题目描述 在星历2012年,星灵英雄Zeratul预测到他所在的Aiur行星在M天后会发生持续性暴雨灾害,尤其是他们的首都.而Zeratul作为星灵族的英雄,当然是要尽自己最大的努力帮助星灵族渡过这场 ...
- 水课 or not
很不幸,这学期的毛概老师是个老古董,讲的内容也甚是枯燥和迂腐,个人角度是不太喜欢.然而这也仅仅是站在个人感性的角度,唏嘘一下也就够了.听不下去了,写点东西. 有时候会想,是不是随着自己长大,渐渐地对专 ...
- D - Mayor's posters POJ - 2528 离散化+线段树 区间修改单点查询
题意 贴海报 最后可以看到多少海报 思路 :离散化大区间 其中[1,4] [5,6]不能离散化成[1,2] [2,3]因为这样破坏了他们的非相邻关系 每次离散化区间 [x,y]时 把y+1点也加入 ...
- Codeforces Round #530 (Div. 2) F (树形dp+线段树)
F. Cookies 链接:http://codeforces.com/contest/1099/problem/F 题意: 给你一棵树,树上有n个节点,每个节点上有ai块饼干,在这个节点上的每块饼干 ...
- 阿里云.log
申请证书审核失败的原因及处理方法;( 新添加站点 免费版 SSL 网页内不能有 HTTPS的连接:更多点击连接)
- jquery-Ajax请求用例码
$.ajax({ type:"post", url: 'domain’, ...
- NOIp2018 游记
作为一名蒟蒻,对于NOIp当然是不抱什么希望.所以就只能在比赛中吸取经验咯... Day0 害怕书到用时方恨少,疯狂打板子(玩电脑) Day1 来到考场了,发现键盘空格按不起,觉得非常尴尬,然后他告诉 ...