TP5中即点即改，json分页，单删
Posted 立里青争
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了TP5中即点即改，json分页，单删相关的知识，希望对你有一定的参考价值。
html页面：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<center>
<table>
<tr>
<td><input type="checkbox"></td>
<td>位置</td>
<td>房源</td>
<td>房源面积</td>
<td>计租面积</td>
<td>户型</td>
<td>建筑结构</td>
<td>租赁性质</td>
<td>状态</td>
{switch name="$list.u_name"}
{case value="root"} <td>操作</td>{/case}
{case value="admin"}{/case}
{/switch}
</tr>
<tbody class="tby">
{volist name="list.data" id="v"}
<tr id="{$v.f_id}">
<td><input type="checkbox" class="box"></td>
<td>{$v.f_wei}</td>
{switch name="$list.u_name"}
{case value="root"} <td class="ww" fd="f_name">{$v.f_name}</td>{/case}
{case value="admin"}<td >{$v.f_name}</td>{/case}
{/switch}
<td>{$v.f_mian}</td>
<td>{$v.f_ji}</td>
<td>{$v.f_hu}</td>
<td>{$v.f_jian}</td>
<td>{$v.f_zu}</td>
<td>{$v.f_static}</td>
{switch name="$list.u_name"}
{case value="root"} <td><a href="javascript:void(0);" class="shan">删除</a></td>{/case}
{case value="admin"}{/case}
{/switch}
</tr>
{/volist}
</tbody>
<input type="hidden" value="1" class="shou_page">
<input type="hidden" value="{$list.zong_page}" class="wei_page">
</table>
<button class="pre">首页</button>
<button class="pre">上一页</button>
<button class="pre">下一页</button>
<button class="pre">尾页</button>
</center>
<script src="__STATIC__/js/jquery.min.js"></script>
<script>
//即点即改
$(document).on("dblclick",".ww",function () {
var fd_val=$(this).attr("fd");
var html_val=$(this).text();
var id=$(this).parents("tr").attr("id");
//替换
$(this).html(‘<input type="text" id="‘+fd_val+html_val+‘" value="‘+html_val+‘">‘)
$("#"+fd_val+html_val).blur(function () {
var new_val=$(this).val();
$(this).parents("td").text(new_val);
//请求
$.post(
"{:url(‘access/ji_gai‘)}",
{
id:id,
new_val:new_val,
fd_val:fd_val
},
function (data) {
}
)
})
})
//分页
$(document).on("click",".pre",function () {
var pre=$(this).text();
var shou_page=$(".shou_page").val();
var wei_page=$(".wei_page").val();
var p="";
if(pre=="首页")
{
p=1;
}else if(pre=="上一页")
{
p=parseInt(shou_page)-1<1?1:parseInt(shou_page)-1;
}else if(pre=="下一页")
{
p=parseInt(shou_page)+1>wei_page?wei_page:parseInt(shou_page)+1;
}else if(pre=="尾页")
{
p=wei_page;
}
//请求
$.post(
"{:url(‘access/show_json‘)}",
{
page:p
},
function (data) {
var res=JSON.parse(data)
var res_list=res.data
var name=res.u_name
if(name=="root")
{
var aa=‘ <td><a href="javascript:void(0);" class="shan">删除</a></td>‘;
var bb=‘class="ww" fd="f_name"‘;
}
var str="";
$.each(res_list,function (k, v) {
str+=‘<tr id="‘+v.f_id+‘">‘;
str+=‘<td><input type="checkbox" class="box"></td>‘
str+=‘<td>‘+v.f_wei+‘</td>‘
str+=‘<td ‘+bb+‘>‘+v.f_name+‘</td>‘
str+=‘<td>‘+v.f_mian+‘</td>‘
str+=‘<td>‘+v.f_ji+‘</td>‘
str+=‘<td>‘+v.f_hu+‘</td>‘
str+=‘<td>‘+v.f_jian+‘</td>‘
str+=‘<td>‘+v.f_zu+‘</td>‘
str+=‘<td>‘+v.f_static+‘</td>‘
str+=‘‘+aa+‘‘;
str+=‘</tr>‘;
})
$(".tby").html(str)
$(".shou_page").val(p)
}
)
})
//删除
$(document).on("click",".shan",function () {
var id=$(this).parents("tr").attr("id");
//请求
$.post(
"{:url(‘access/dan_del‘)}",
{
id:id
},
function (data) {
var re=JSON.parse(data)
if(re==1)
{
alert("单删成功")
document.getElementById(id).remove();
}else if(re==2)
{
alert("单删失败")
}
}
)
})
</script>
</body>
</html>
php页面：
<?php
namespace appindexcontroller;
use thinkController;
use thinkDb;
use thinkRequest;
use thinkSession;
use appindexmodelFang_yuan;
use appindexcontrollerCommen;
class Access extends Commen
{
//页面分页展示
public function fang_list()
{
$user=Session::get("user",‘think‘);
$u_name=$user[‘u_name‘];
$p=Request::instance()->param("page");
$page=empty($p)?1:$p;
$count=Db::table("fang_yuan")->count();
$tiao=3;
$zong_page=ceil($count/$tiao);
$limit=($page-1)*$tiao;
$data=Db::table("fang_yuan")->limit($limit,$tiao)->select();
$list=[‘data‘=>$data,‘zong_page‘=>$zong_page,‘u_name‘=>$u_name];
return view("show",[‘list‘=>$list]);
}
//分页的json格式
public function show_json()
{
$user=Session::get("user",‘think‘);
$u_name=$user[‘u_name‘];
$p=Request::instance()->param("page");
$page=empty($p)?1:$p;
$count=Db::table("fang_yuan")->count();
$tiao=3;
$zong_page=ceil($count/$tiao);
$limit=($page-1)*$tiao;
$data=Db::table("fang_yuan")->limit($limit,$tiao)->select();
$list=[‘data‘=>$data,‘zong_page‘=>$zong_page,‘u_name‘=>$u_name];
echo json_encode($list);
}
//单删
public function dan_del()
{
$id=Request::instance()->param("id");
$aa=new Fang_yuan();
$a=$aa->del($id);
if($a)
{
echo json_encode(1);
}else{
echo json_encode(2);
}
}
//即点即改
public function ji_gai()
{
$id=Request::instance()->param("id");
$new_val=Request::instance()->param("new_val");
$fd_val=Request::instance()->param("fd_val");
$a=Db::table("fang_yuan")->where("f_id=‘$id‘")->update(["$fd_val"=>"$new_val"]);
if($a)
{
return 1;
}else{
return 2;
}
}
}
以上是关于TP5中即点即改，json分页，单删的主要内容，如果未能解决你的问题，请参考以下文章
如何解决MSI类型的Sharepoint Server2016 安装即点即用的office 2016 plus问题