HTML部分-----------------------------------------------------------------------------------------

http-equiv="Content-Type" content="text/html;

charset=UTF-8">

Insert title

here

type="text/javascript">

$(function() {

addchange();

$(".bnew").click(bnewclick);

});

//定义修改按钮工具

function addchange() {

$csave = "

>"

$cbch = ""

$cbde = "

value='删除'>"

$(".tdc").html($csave + $cbch +

$cbde);

$(".bch").click(bahclick);

$(".bsave").click(bsaveclick);

$(".bde").click(bdeclick);

}

//开启修改功能

function bahclick() {

//更改修改按钮

$(this).addClass("display1");

$(this).parent().children().eq(2).addClass("display1");

$(this).parent().children().eq(0).removeClass("display1");

//取原值

$thiss =

$(this).parent().parent().children()

$cid = $thiss.eq(0).text();

$cname = $thiss.eq(1).text();

$csex = $thiss.eq(2).text();

if($csex == "男") {

$secn = "selected='selected'";

$secv = ""

} else {

$secn = "";

$secv = "selected='selected'"

}

$csrc = $thiss.eq(3).text();

//定义修改框体

$inputname = "

type='text' value='" + $cname +

"'>";

$inputsex =

"

value='男' " + $secn +

">男

value='女'" + $secv +

">女

";

$inputscore = "

type='text'value=" + $csrc + ">";

$thiss.eq(1).html($inputname);

$thiss.eq(2).html($inputsex);

$thiss.eq(3).html($inputscore);

};

//修改保存功能

function bsaveclick() {

//AJAX取值

$thiss =

$(this).parent().parent().children()

$id = $thiss.eq(0).text();

$name =

$thiss.eq(1).children().val();

$sex =

$thiss.eq(2).children().val();

$src =

$thiss.eq(3).children().val();

//AJAX提交

$.post("new1.php", {

full : [$id, $name, $sex, $src,

'1']

}, function(msg) {

});

//更改保存按钮

$(this).addClass("display1");

$(this).parent().children().eq(1).removeClass("display1");

$(this).parent().children().eq(2).removeClass("display1");

//AJAX回传验证

$.post("new1.php", {

full : [$id, $name, $sex, $src,

'2']

}, function(msg) {

obj = $.parseJSON(msg);

//alert(obj[1]+obj[2]+obj[3]);

$thiss.eq(1).html(obj[1]);

$thiss.eq(2).html(obj[2]);

$thiss.eq(3).html(obj[3]);

});

};

//新增功能

function bnewclick() {

//AJAX取值

$thiss =

$(this).parent().parent().children()

$id =

$thiss.eq(0).children().val();

$name =

$thiss.eq(1).children().val();

$sex =

$thiss.eq(2).children().val();

$src =

$thiss.eq(3).children().val();

//未填项目验证

if($id == '' || $name == '' || $src

== '') {

alert("有项目未填写")

} else {

//AJAX提交

$.post("new1.php", {

full : [$id, $name, $sex, $src,

'3']

}, function(msg) {

//验证ID重复

if(msg == 1) {

alert("ID号重复");

$thiss.eq(0).children().val("");

} else {

//AJAX回传验证

$.post("new1.php", {

full : [$id, $name, $sex, $src,

'2']

}, function(msg) {

//增加新项目

obj = $.parseJSON(msg);

$a = "

" +

obj[0] +

"

"

+ obj[1] +

"

"

+ obj[2] +

"

"

+ obj[3] + "

"

$thiss.parent().before($a);

addchange()

$thiss.eq(0).children().val("");

$thiss.eq(1).children().val("");

$thiss.eq(3).children().val("");

})

}

})

}

};

//删除功能

function bdeclick() {

$r = confirm("是否确认删除")

if($r == true) {

$thiss =

$(this).parent().parent();

$id =

$thiss.children().eq(0).text();

$.post("new1.php", {

full : [$id, '', '', '', '4']

}, function(msg) {

//alert($id);

$thiss.remove();

})

}

};

td {

width: 100px;

}

input, option, select {

width: 95px;

}

.bch, .bde {

width: 50px;

}

.bsave, .bnew {

width: 100px;

}

.add {

border: 1px red solid

}

.display1 {

display: none

}

学号

姓名

性别

分数

include 'new1.php';

$xd = new new1();

echo

$xd->five();

?>

value='男'>男

value='女'>女

value="新增">

PHP部分-----------------------------------------------------------------------------------------

$arr = $_POST ['full'];

$conn = mysql_connect ( "localhost",

"root", "" );

mysql_select_db ( "test", $conn

);

mysql_query ( "set names 'utf8'"

);

switch ($arr [4]) {

case 1 : //更新

$sql = "update  sus

set'" . "$arr[1]" . "'" . ",sex=" . "'" . "$arr[2]" .

"'" . ",src=$arr[3] where id=$arr[0]"; //sql语句

$result = mysql_query ( $sql

);

break;

case 2 : //验证

$sql = "select * from

sus where id=$arr[0]";

$result = mysql_query ( $sql

);

$row = mysql_fetch_array ( $result

);

echo json_encode ( $row );

break;

case 3 : //新增

$sql = "select * from

sus where id=$arr[0]";

$result = mysql_query ( $sql

);

$amount = mysql_num_rows ( $result

);

if ($amount != 0) {

echo $amount;

} else {

$sql = "insert into

sus (id,name,sex,src)value (" . $arr [0] . ",'" .

$arr [1] . "','" . $arr [2] . "'," . $arr [3] . ")"; //sql语句

$result = mysql_query ( $sql

);

echo $sql;

}

;

break;

case 4 : //删除

$sql = "delete

from  sus where

id=$arr[0]";

$result = mysql_query ( $sql

);

break;

}

class new1 {//数据库遍历

public function five() {

$conn = mysql_connect ( "localhost",

"root", "" );

mysql_select_db ( "test", $conn

);

mysql_query ( "set names 'utf8'"

);

$sql = "select * from sus order by

id";

$result = mysql_query ( $sql

);

while ( ! ! $row = mysql_fetch_array

( $result ) ) {

echo "

$row[0]$row[1]$row[2]$row[3]";

}

mysql_close ( $conn );

}

}

?>

文章转载请注明来源。新辉网主页 > 网页基础 > Javascript/Ajax >

标题：Jquery+AJAX+PHP+MYSQL动态web表单增删改查源代码

地址：http://www.a55.com.cn/a/7586.html

关键词：Jquery+AJAX+PHP+MYSQL动态web表单增删