PHP

<?php
$action = $_GET['action'];
switch ($action) {
case 'init_data_list':
init_data_list();
break; case 'add_row':
add_row();
break; case 'del_row':
del_row();
break; case 'edit_row':
edit_row();
break;
}
// 列表
function init_data_list(){
$data = array();
$query = query_sql('select * from `et_data` order by `id` asc');
while($row = $query->fetch_assoc()){
$data[] = $row;
}
echo json_encode($data);
}
//删除
function del_row(){
$dataid = $_POST['dataid'];
$sql = "DELETE FROM `et_data` WHERE `id` = " . $dataid;
if(query_sql($sql)){
echo "ok";
} else {
echo "db error ...";
}
}
//添加
function add_row(){
$sql = 'INSERT INTO `et_data` ( `c_a`,`c_b`,`c_c`,`c_d`,`c_e`,`c_f`,`c_g`,`c_h`) VALUES(';
for($i=; $i<; $i++){
$sql .= '\'' . $_POST['col_' .$i] . '\', ';
}
$sql = trim($sql,", ");
$sql .= ")";
if($res = query_sql($sql,"SELECT LAST_INSERT_ID() as LD")){
$d = $res->fetch_assoc();
echo $d['LD'];
} else {
echo "db error ...";
}
}
//修改
function edit_row(){
$sql = 'UPDATE `et_data` SET ';
$id = $_POST['id'];
unset($_POST['id']);
for($i = ; $i < ; $i++){
$sql .= ' `c_' . chr(+$i) . '` = \'' . $_POST['col_' . $i] . '\' , ';
}
$sql = trim($sql,", ");
$sql .= ' WHERE `id` = ' . $id ; if(query_sql($sql)){
echo "ok";
} else {
echo "db error ...";
}
}
// 初始化数据库
function query_sql(){
$mysqli = new mysqli("127.0.0.1", "root", "root", "etable");
$sqls = func_get_args();
foreach($sqls as $s){
$query = $mysqli->query($s);
}
$mysqli->close();
return $query;
}

JS

$(function(){

    var g_table = $('table.data');
var init_data_url = "data.php?action=init_data_list"; $.get(init_data_url, function(data){
var row_items = $.parseJSON(data);
for (var i = 0, j = row_items.length; i < j; i++) {
var data_dom = create_row(row_items[i]);
g_table.append(data_dom);
}
}); //删除事件
function delHandler(){
if (confirm('确定要删除吗?')) {
var data_id = $(this).attr("dataid");
var meButton = $(this);
$.post("data.php?action=del_row",{dataid:data_id},function(res){
if("ok" == res) {
$(meButton).parent().parent().remove();
} else {
alert("删除失败...");
}
});
}
} //修改事件
function editHandler(){
var data_id = $(this).attr("dataid");
var meButton = $(this);
var meRow = $(this).parent().parent();//没有事件 var editRow = $("<tr></tr>"); for (var i = 0; i < 8; i++) {
var editTd = $("<td><input class='textField' type='text' /></td>");
var v = meRow.find('td:eq('+ i +')').html();
editTd.find('input').val(v);
editRow.append(editTd);
} var opt_td = $("<td></td>");
var saveButton = $('<a class="opLink" href="javascript:">确认&nbsp;</a>');
saveButton.click(function(){
var currentRow = $(this).parent().parent();
var input_fields = currentRow.find("input");
var post_fields = {};
for( var i = 0 , j = input_fields.length; i < j; i++){
post_fields['col_' + i] = input_fields[i].value;
}
post_fields['id'] = data_id;
$.post('data.php?action=edit_row',post_fields,function(res){
if("ok" == res){
var newUpdateRow = create_row(post_fields);
currentRow.replaceWith(newUpdateRow);
} else {
alert("数据更新失败...");
}
});
}); var canceButton = $('<a class="opLink" href="javascript:">&nbsp;取消</a>');
canceButton.click(function(){
var currentRow = $(this).parent().parent();
meRow.find('a:eq(0)').click(delHandler);
meRow.find('a:eq(1)').click(editHandler);
currentRow.replaceWith(meRow);//需重新绑定事件
}) opt_td.append(saveButton);
opt_td.append(canceButton); editRow.append(opt_td);
meRow.replaceWith(editRow);
} //列表
function create_row(data_item){
var row_obj = $("<tr></tr>");
for(var k in data_item){
if ("id" != k) {
var col_td = $("<td></td>");
col_td.html(data_item[k]);
row_obj.append(col_td);
}
} var delButton = $('<a class="opLink" href="javascript:">删除&nbsp;</a>');
delButton.attr("dataid", data_item['id']);
delButton.click(delHandler); var editButton = $('<a class="opLink" href="javascript:">编辑&nbsp;</a>');
editButton.attr("dataid", data_item['id']);
editButton.click(editHandler); var opt_td = $('<td></td>');
opt_td.append(delButton);
opt_td.append(editButton);
row_obj.append(opt_td);
return row_obj;
} // 添加
$("#addBtn").click(function(){
var addRow = $("<tr></tr>"); for (var i = 0; i < 8; i++) {
var col_td = $("<td><input type='text' class='textField' /></td>")
addRow.append(col_td);
} var col_opt = $("<td/></td>"); var confirmBtn = $('<a class="opLink" href="javascript:">确认&nbsp;</a>');
confirmBtn.click(function(){
var currentRow = $(this).parent().parent();
var input_fields= currentRow.find('input');
var post_fields = {};
for(var i = 0 , j = input_fields.length; i< j ; i++){
post_fields['col_' + i] = input_fields[i].value;
}
$.post("data.php?action=add_row", post_fields, function(res){
if( 0 < res){
post_fields['id'] = res;
var postAddRow = create_row(post_fields);
currentRow.replaceWith(postAddRow);
} else {
alert("插入失败...");
}
})
}); var cancelBtn = $('<a class="opLink" href="javascript:">&nbsp;取消</a>');
cancelBtn.click(function(){
$(this).parent().parent().remove();
}); col_opt.append(confirmBtn);
col_opt.append(cancelBtn); addRow.append(col_opt);
g_table.append(addRow);
}); });

数据库

grant all privileges on  etable.* to 'shaddow'@'localhost' identified by '';
DROP DATABASE IF EXISTS aetable;
create database aetable;
use aetable;
create table et_data(
id int primary key auto_increment,
c_a varchar(30),
c_b varchar(30),
c_c varchar(30),
c_d varchar(30),
c_e varchar(30),
c_f varchar(30),
c_g varchar(30),
c_h varchar(30)
); LOCK TABLES `et_data` WRITE;
/*!40000 ALTER TABLE `et_data` DISABLE KEYS */;
INSERT INTO `et_data` VALUES (12,'my','heart','will','go','on','and','on','forever'),(13,'hello','world','are','you','ok','with','your','skill'),(14,'when','i','was','young','i','listen','to','the radio'),(15,'wait','for','my','faveriate','song','you','like','it'),(17,'你','好','吗?','你','真的','好','嘛','确定?'),(18,'我','很','好','啊','谢谢','你','吧','非常'),(19,'故事','发生','在','','年','那时候','我们','都不大'),(20,'php','javascript','c','c++','python','golang','c#','java');
UNLOCK TABLES;

php+Ajax 例子的更多相关文章

  1. Ajax例子,views返回,html接收数据

    Ajax例子,views返回,html接收数据 views from django.shortcuts import render,HttpResponse,render_to_response im ...

  2. struts2框架下的一个简单的ajax例子

    举个例子 jsp页面: <%@ page language="java" import="java.util.*" pageEncoding=" ...

  3. DOM编程艺术章12:一个简单的Ajax例子

    大概入了JavaScript的门,现在要回过头恶补Ajax和json了,随手翻到dom编程艺术发现有一个适合回忆的例子,先抄录下来,引入对Ajax作用的大概印象,再去掰开了研究. <!DOCTY ...

  4. 一个jquery ajax例子

    上次搞了个jquery的AutoComplete效果,感觉很久没写jquery了,趁热打铁,再找点东西练练手.这不,看了一下jquery手册,顺便写了一个小例子,源码我直接贴上来了.   1.新建一个 ...

  5. 原生javascript和jquery实现简单的ajax例子

    后台C#代码 public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/p ...

  6. ajax例子:审核验证用户名;登录界面

    审核验证用户名主页面: <body><div>用户名:<input type="text" id="uid" /><s ...

  7. ajax 例子

    引用 function initCsvModel(year,cityId){ var args = new Object(); args.url= "listUpload!initCsvMo ...

  8. 简单的Ajax例子

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jquery ajax例子

    (1)取得服务端当前时间 jquery对象.load(url,sendData,function(backData,textStatus,xhr){... ...}) load():如果无参的话,就以 ...

  10. cakephp2.x 一个ajax例子.md

    CakePHP中的ajax还是比较简单,但要注意一些细节. app/View/Layouts下新建ajaxtest.ctp <!DOCTYPE html PUBLIC "-//W3C/ ...

随机推荐

  1. Django学习笔记之视图高级-类视图

    类视图 在写视图的时候,Django除了使用函数作为视图,也可以使用类作为视图.使用类视图可以使用类的一些特性,比如继承等. View django.views.generic.base.View是主 ...

  2. org.apache.commons等常用工具学习

    StringUtils 1,StringUtils.isNotBlank isNotEmpty : 判断某字符串是否非空 StringUtils.isNotEmpty(null) = false St ...

  3. dd/MMM/yyyy:hh:mm:ss +0800日期格式的转化

    private static void myHandler() throws ParseException { String dtime1 = "23/Apr/2019:04:08:00 + ...

  4. MyBatis DTD文件下载地址

    下载链接: http://mybatis.org/dtd/mybatis-3-config.dtdhttp://mybatis.org/dtd/mybatis-3-mapper.dtd

  5. 在已安装64位oracle的服务器安装32位客户端

    应用场景:服务器操作系统是win2012 64位,原先安装了64位oracle12,后来系统增加导入excel的功能,网站必须启用32位兼容模式,这时候发现原有的页面打不开,提示: 试图加载格式不正确 ...

  6. C#工具类:Json操作帮助类(转载)

    原文转载自C#工具类:Json操作帮助类_IT技术小趣屋. Json序列化和反序列化在程序开发中时常会遇到,在C#中可以使用很多种方法实现对数据的Json序列化和反序列化,封装一个Json操作工具类来 ...

  7. visual studio 2015引入开源控件DockPanel(最简单的方法)

    一.DockPanel简介 DockPanel是一个开源控件,能够实现子窗口的浮动,在官方给的demo有演示,在vs2017微软已经集成进入常用控件中.我主要使用的是多窗口浮动,和tabControl ...

  8. orcad 自带常用原理图库解析

    在cadence 安装目录下文件夹\Cadence\SPB_16.6\tools\capture\library 中有如下常用库,只是部分常用的库,还有很多不常用的也都在目录下面, 1.AMPLIFI ...

  9. php sleep函数延迟执行

    PHP sleep函数一般用于定时执行任务中,表示延迟多少秒在执行程序.这里主机吧主要给大家讲一下sleep函数的语法和应用实例. sleep函数语法: sleep(seconds); //secon ...

  10. win 10 在vs2017下对mpi的安装以及认识

    这里我先对MPI进行一下简单的介绍,MPI的全称是Message Passing Interface,即消息传递接口. 它并不是一门语言,而是一个库,我们可以用Fortran.C.C++结合MPI提供 ...