Question

我想用jquery对话框编辑字段，但无法找到问题。我从表中获取数据。只有当我点击顶部编辑按钮，第二个编辑按钮不工作时，才会显示jquery对话框。

由于

<?php 
include "db.php";
?>

<!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=iso-8859-1" />
<title>Registration Form</title>
<script type="text/javascript" language="javascript" charset="utf-8" src="jquery.js"></script>


<script type="text/javascript" language="javascript" charset="utf-8" src="jquery.form.js"></script>
<script type="text/javascript" language="javascript" charset="utf-8" src="jquery.blockUI.js"></script>
<style type="text/css">
#overview h2 { border: 1px dashed gray; padding: 10px; background-color: #ffc;
    color: black; font-size: medium; margin: 10px 0;
}
#footer { font-family: sans-serif; color: #888 }
#domMessage { padding: 10px; }
div.blockMe { padding: 30px; margin: 30px; border: 10px solid #ccc; background-color: #ffd }
#question { background-color: #ffc; padding: 10px; }
#question input { width: 4em }

#demoTable { border: 1px solid #ddd }
#demoTable tr.odd { background-color: #efe }
#demoTable th { padding: 15px; background-color: #ffa }
#demoTable td { padding: 15px; vertical-align: top }
#tallContent h1 { margin: 15px }

#twitter { float:right; right: 20px; margin: 0 15px 15px 15px }
#twitter a { text-decoration: none; font-family: arial }
#twitter img { border: none; float: left }
</style>

<script>
$(document).ready(function() {
    $('#demo1').click(function() {
        $.blockUI({ message: $('#loginForm') });

    });
    $('#close').click(function() {
        $.unblockUI();


    });
});

</script>
</head>

<body>
<fieldset>
 <legend><strong>Labs:</strong></legend></fieldset>
<table align="center" width="80%"> 
<tr><td align="right" ><a href="pt.php"><button>+</button></a></td></td></tr>
</table>
<table align="center"  border="1" cellpadding="5" cellspacing="0" width="80%" bordercolor="#CCCCCC">


    <tr style="background-image:url(img/tr.png);">
    <th>ID:</th>
    <th>Date of Report:</th>
    <th>Name:</th>
    <th>Action</th>
    </tr>

<?php
$str="select * from `labs` order by `id` DESC ";
$rs=mysql_query($str);
?>
<?php
while($row=mysql_fetch_array($rs))
{
?>
<tr>
<td><?php echo $row['id'];?> </td>
<td><?php echo $row['date'];?></td>
<td><?php echo $row['name'];?> </td>
<td align="center"><button id="demo1">Edit</button>
<a href="delte.php?id=<?php echo $row['id'];?>"><button>X</button></a></td>


</tr>
<?php
}
?>
     <div id="loginForm" style="display:none;width:300px;height:200px;background-color:#b0c4de;margin:20px;padding:30px;">

            <p><label>Date of Report:</label><input type="text" name="demo1" /></p>
            <p><label>Name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label><input type="text" name="demo1" /></p>
            <a href="#" id="close">Update</a>
        </div>

</table>
</body>
</html>

的 edit.php 的

<?php 
include "db.php";
$action=$_POST['action'];
$id=$_REQUEST['id'];

$str="select * from `labs` where id='$id'";

$rs=mysql_query($str);
$row=mysql_fetch_array($rs);

?>

<!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=iso-8859-1" />
<title>Labs</title>

</head>

<body>
<table align="center" width="75%" border="0">
<form name="frm" method="post" action="<?php $_SERVER['PHP_SELF'] ?>" enctype="multipart/form-data">
  <fieldset>
    <legend>Labs:</legend>
    <tr><td><strong>Date of Report:</strong></td><td ><input type="text" size="10" name="date" value="<?php echo $row['date']?>" />dd/mm/yyyy </td></tr><br />
    <tr><td><strong>Name:</strong></td><td > <input type="text"  size="30" name="name" value="<?php echo $row['name']?>" /></td></tr><br />

    <tr><td colspan="2" align="center"><input type="submit" name="insert" value="Submit" /></td></tr>
  </fieldset>
  <tr><td colspan="2"><font color="#FF0000"><?php $msg=$_REQUEST['msg'];
  echo $msg;
  ?></font></td></tr>

</form>
</table>


</body>
</html>
<?php 
if(isset($_POST['insert']));
{


$date=$_POST['date'];
$name=$_POST['name'];
if(!$name==" ")
{
exit(0);
}
$sql="UPDATE `labs` SET  `date` =  '$date',
`name` =  '$name' WHERE  `labs`.`id` =$id LIMIT 1 ";

mysql_query($sql);

}
?>

Answer 1

你的代码是一团糟，但不是把它拆分到基础并重新构建它，我只是提供一个快速的解决方案。

在主文件中，更改

$(document).ready(function() {
    $('#demo1').click(function() {
        $.blockUI({ message: $('#loginForm') });

    });

到

$(document).ready(function() {
    $('.demoButton').click(function() {
        $.blockUI({ message: $('#loginForm') });

    });

并更改

<td align="center"><button id="demo1">Edit</button>
<a href="delte.php?id=<?php echo $row['id'];?>"><button>X</button></a></td>

到

<td align="center"><button class="demoButton">Edit</button>
<a href="delte.php?id=<?php echo $row['id'];?>"><button>X</button></a></td>

ID必须在页面中是唯一的。由于你在while()循环中有按钮元素，并且它保留了相同的ID，这是一个问题，jQuery只会绑定到它找到的具有指定ID的第一个元素。

另一方面，类可以在整个页面中多次出现。因此，我们将属性从id="..."更改为class="..."，将jQuery选择器从ID更改为Class。

jQuery更新表单中的问题（PHP）

1 个答案: