这里是用的laravel框架
首先是前台模板:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script language="JavaScript" src="{{ URL::asset('/') }}Common/jquery123.js"></script>
</head>
<body>
测试页面
<table border="1">
<tr>
<td>选择</td>
<td>ID</td>
<td>内容</td>
<td>删除</td>
<td>修改</td>
</tr>
@foreach($res as $v)
<tr cid="{{$v['id']}}">
<td><input type="checkbox" name="smallBox" value="{{$v['id']}}"/></td>
<td>{{$v['id']}}</td>
<td><span class="con">{{$v['content']}}</span></td>
<td><a href="javascript:void(0)" class='del'>删除</a></td>
<td><a href="save?id={{$v['id']}}">修改</a></td>
</tr>
@endforeach
</table>
<input type="button" value="全选" id="selectAll"/>
<input type="button" value="反选" id="selectNo"/>
<input type="button" value="不选" id="selectNoAll"/>
<input type="button" value="批删" id="delAll"/>
</body>
</html>
<script>
$(function(){
// 全选
$("#selectAll").click(function () {
$("input[name='smallBox']").attr('checked',true);
});
// 反选
$("#selectNo").click(function(){
$("input[name='smallBox']").each(function(){
$(this).attr("checked",!$(this).attr("checked"))
})
})
// 全不选
$("#selectNoAll").click(function () {
$("input[name='smallBox']").attr('checked',false);
});
// AJAX删除
$(".del").click(function(){
var _this = $(this);
var id = _this.parents('tr').attr('cid');
// alert(id);
var url = "del";
var data = {id:id};
$.get(url,data,function(data){
if(data==1){
_this.parents('tr').remove();
}else{
alert("删除失败");
}
})
})
// AJAX批量删除
$("#delAll").click(function(){
var sid = [];
$("input[name='smallBox']:checked").each(function () {
sid.push($(this).val());
});
// alert(sid);return false;
var url = "delAll";
var data = {sid:sid};
$.get(url,data,function(data){
// window.print(data);return false;
if(data==1){
$("input[name='smallBox']:checked").each(function () {
$(this).parents('tr').remove();
});
}else{
alert("删除失败");
}
})
})
// 即点即改
$(document).on("click",".con",function(){
// 获取要修改的内容
var con = $(this).html();
// 把要修改的内容的地方换成input框
$(this).parent().html("<input name='content' value='"+con+"'/>");
// 事件委托
$(document).on("blur","input[name='content']",function(){
var _this = $(this);
// 获取新输入的值
var content = $(this).val();
var id = $(this).parents('tr').attr('cid');
var url = "update";
var data = {id:id,content:content}
$.get(url,data,function(){
_this.parent().html('<span class="con">'+content+'</span>');
})
})
})
})
</script>
接下来是后台处理
<?php
namespace App\Http\Controllers;
use DB;
use Illuminate\Foundation\Bus\DispatchesJobs;
use Illuminate\Routing\Controller as BaseController;
use Illuminate\Foundation\Validation\ValidatesRequests;
use Illuminate\Foundation\Auth\Access\AuthorizesRequests;
use Illuminate\Http\Request;
class TestController extends Controller{
public function show(){
return view('home/form');
}
public function add(Request $qequest){
$content = $qequest->input('content');
// echo $content;die;
$arr = DB::table('liuyan')->insert(['content'=>$content]);
if($arr){
return redirect('select');
}
}
public function select(){
$res = DB::table('liuyan')->get();
return view('home/select',['res'=>$res]);
}
public function del(Request $qequest){
$id = $qequest->input('id');
// echo $id;
$res = DB::table('liuyan')->delete(['id'=>$id]);
if($res){
echo 1;
}else{
echo 0;
}
}
public function delAll(Request $qequest){
$id = $qequest->input('sid');
foreach($id as $v){
$res = DB::table('liuyan')->delete(['id'=>$v]);
}
if($res){
echo 1;
}else{
echo 0;
}
}
public function update(Request $request){
$id = $request->input('id');
$content = $request->input('content');
$res = DB::table('liuyan')->where('id',$id)->update(['content'=>$content]);
if($res){
echo 1;
}else{
echo 0;
}
}
}