查看: 242|回复: 1

[求助] “可编辑的表格：jQuery+PHP实现实时编辑表格字段内容”save.ph [复制链接]

Rank: 1

发表于 2011-10-25 16:00:05 |显示全部楼层

最近在看到可编辑表格实例，在本地调试时发现，在index.php页面可实现根据id值查询显示，但是id值无法传递到save.php页面，也就是更新语句中where id=不能随index.php的id而变化，恳请朋友帮助解决。谢谢了！$query=mysql_query("update customer set $field='$val',modifiedtime='$time' where id='$id'");
index.php文件代码
<?php
$id=$_POST['id'];
?>
<?php
include_once("connect.php");
$query=mysql_query("select * from customer where id='$id'");
$rs=mysql_fetch_array($query);
$id=$rs['id'];
$username=$rs['username'];
$userid=$rs['userid'];
$solutation=$rs['solutation'];
$phone=$rs['phone'];
$company=$rs['company'];
$mobile=$rs['mobile'];
$source=$rs['source'];
$sdate=$rs['sdate'];
$job=$rs['job'];
$web=$rs['web'];
$email=$rs['email'];
$createtime=$rs['createtime'];
$modifiedtime=$rs['modifiedtime'];
$note=$rs['note'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="jquery.php" />
<meta name="description" content="Helloweba演示平台，演示XHTML、CSS、jquery、PHP案例和示例" />
<title>可编辑的表格：jQuery+PHP实现实时编辑表格字段内容-Helloweba演示平台</title>
<link rel="stylesheet" type="text/css" href="../css/main.css" />
<link rel="stylesheet" type="text/css" href="css/jquery-ui.css" />
<style type="text/css">
table{width:96%; margin:20px auto; border-collapse:collapse;}
table td{line-height:26px; padding:2px; padding-left:8px; border:1px solid #b6d6e6;}
.table_title{height:26px; line-height:26px; background:url(css/btn_bg.gif) repeat-x bottom; font-weight:bold; text-indent:.3em; outline:0;}
.table_label{background:#e8f5fe; text-align:right; }
.btn{height:24px; background:url(css/btn_bg.gif) repeat-x; padding:0 4px; font-size:12px; border:1px solid #ccc; cursor:pointer; margin-left:3px}
.input{border:1px solid #369; background:#ffc; padding:2px}
.msg{padding-left:30px; margin-top:20px}
textarea{font-size:12px}
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.jeditable.js"></script>
<script type='text/javascript' src="js/jquery-ui.js"></script>
<script type='text/javascript' src="js/ui.datepicker-zh-CN.js"></script>
<script type="text/javascript">
$(function(){
$('.edit').editable('save.php', {
width    :120,
height :18,
//onblur : "ignore",
      cancel : '取消',
      submit : '确定',
      indicator : '<img src="css/loader.gif">',
      tooltip : '单击可以编辑...',
callback  : function(value, settings) {
$("#modifiedtime").html("刚刚修改……");
      }

   });
$('.edit_select').editable('save.php', {
loadurl : 'json.php',
type    : "select",
cancel : '取消',
      submit : '确定',
      indicator : '<img src="css/loader.gif">',
      tooltip : '单击可以编辑...',
style    : 'display: inline'
});
$(".datepicker").editable('save.php', {
width    : 120,
type    : 'datepicker',
onblur : "ignore",
cancel : '取消',
      submit : '确定',
      indicator : '<img src="css/loader.gif">',
      tooltip : '单击可以编辑...',
style    : 'display: inline'
});
$(".textarea").editable('save.php', {
type    : 'textarea',
rows    : 6,
cols    : 50,
onblur : "ignore",
cancel : '取消',
      submit : '确定',
      indicator : '<img src="css/loader.gif">'
});

});
//调用jquery ui的datepicker日历插件
$.editable.addInputType('datepicker', {
element : function(settings, original) {
      var input = $('<input class="input" />');
input.attr("readonly","readonly");
      $(this).append(input);
      return(input);
},
plugin : function(settings, original) {
var form = this;
$("input",this).datepicker();
}
});
</script>
</head>

<body>
<div id="header">
<div id="logo"><h1><a href="http://www.helloweba.com" title="返回helloweba首页">helloweba</a></h1>
   <form id="form1" name="form1" method="post" action="index.php">
   id
   <label>
      <input type="text" name="id" size=7 id="id" />
   </label>
   <label>
      <input type="submit" name="submit" id="id" value="提交" />
      </label>
   </form>
</div>
</div>

<div id="main">
  <h2 class="top_title"><a href="http://www.helloweba.com/view-blog-74.html">可编辑的表格：jQuery+PHP实现实时编辑表格字段内容</a></h2>
  <div class="msg"><strong>提示</strong>：点击表格中字段对应的内容即可进行在线编辑。</div>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <thead>
<tr class="table_title">
   <td colspan="4"><span class="open"></span>客户信息</td>
</tr>
  </thead>
  <tbody>
<tr>
   <td class="table_label">id</td>
   <td class="text" id="id"><?php echo $id; ?></td>
   <td class="table_label"> </td>
   <td class="edit" id="phone3"> </td>
</tr>
<tr>
   <td width="20%" class="table_label">姓名</td>
   <td width="30%" class="edit" id="username"><?php echo $username; ?></td>
   <td width="20%" class="table_label">办公电话</td>
   <td width="30%" class="edit" id="phone"><?php echo $phone; ?></td>
</tr>
<tr>
   <td class="table_label">称谓</td>
   <td class="edit" id="solutation"><?php echo $solutation; ?></td>
   <td class="table_label">手机</td>
   <td class="edit" id="mobile"><?php echo $mobile; ?></td>
</tr>
<tr>
   <td class="table_label">公司名称</td>
   <td class="edit" id="company"><?php echo $company; ?></td>
   <td class="table_label">电子邮箱</td>
   <td class="edit" id="email"><?php echo $email; ?></td>
</tr>
<tr>
   <td class="table_label">潜在客户来源</td>
   <td class="edit_select" id="source"><?php echo $source; ?></td>
   <td class="table_label">有限期</td>
   <td class="datepicker" id="sdate"><?php echo $sdate; ?></td>
</tr>
<tr>
   <td class="table_label">职位</td>
   <td class="edit" id="job"><?php echo $job; ?></td>
   <td class="table_label">网站</td>
   <td class="edit" id="web"><?php echo $web; ?></td>
</tr>
<tr>
   <td class="table_label">创建时间</td>
   <td><?php echo $createtime; ?></td>
   <td class="table_label">修改时间</td>
   <td id="modifiedtime"><?php echo $modifiedtime; ?></td>
</tr>
<tr>
   <td class="table_label">备注</td>
   <td class="textarea" id="note" colspan="3"><?php echo $note; ?></td>
</tr>
  </tbody>
</table>
<br />
<br />
<br />
<br />
<br />

</div>
<div id="footer">
<p>Powered by helloweba.com  允许转载、修改和使用本站的DEMO，但请注明出处：<a href="http://www.helloweba.com">www.helloweba.com</a></p>
</div>
<p id="stat"><script type="text/javascript" src="http://js.tongji.linezing.com/1870888/tongji.js"></script></p>
</body>
</body>
</html>
seva.php代码
<?php
include_once("connect.php");
$field=$_POST['id'];
$val=$_POST['value'];
$val = htmlspecialchars($val, ENT_QUOTES);
if($field=="note"){
if(strlen($val)>100){
echo "您输入的字符大于100字了";
exit;
}
}
$time=date("Y-m-d H:i:s");
if(empty($val)){
echo "不能为空";
}else{
$query=mysql_query("update customer set $field='$val',modifiedtime='$time' where id='$id'");
if($query){
echo $val;
}else{
echo "数据出错";
}
}
?>

使用道具举报

gbdjys

前端新人

Rank: 1

发表于 2011-10-28 20:15:26 |显示全部楼层

自己解决了！

使用道具举报

返回列表

帐号		自动登录	找回密码
密码			注册