继续PHP - pass hidden value into the jquery
<html>
<head>
<link rel="stylesheet" href="js/jquery-ui-themes-1.11.1/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.11.1/jquery-ui.js"></script>
<script>
$(document).ready(function(){
$(".buttonsPromptConfirmDeleteDepartment").click(function(){
$("#dialogConfirmDeleteDepartmentBox").dialog({
modal: true,
resizable: false,
width: 300,
height: 150,
dialogClass: "dialogConfirmDeleteDialogBox",
position: { my: 'top', at: 'top+300' },
open: function() {
var message = 'Are you sure you want to delete this department?';
$(this).html(message);
},
buttons:
[
{
text: "OK",
click: function()
{
var departmentID = $(this).next('input.departmentID').val();
alert(departmentID);
},
style:"margin-right: 60px;"
},
{
text: "Cancel",
click: function ()
{
$(this).dialog("close");
},
style:"margin-left: 0px;"
},
]
});
});
});
</script>
</head>
<body>
<?php
//db connection
$query = "SELECT *
FROM department
ORDER BY dept_ID ASC";
$result = mysqli_query($dbc, $query);
$total_department = mysqli_num_rows($result);
if($total_department > 0)
{
?>
<table width="600" border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
<tr>
<td width="80" align="center">ID</td>
<td width="300" align="center">Department</td>
<td width="220" align="center">Action</td>
</tr>
<?php
while($row = mysqli_fetch_array($result))
{
?>
<tr>
<td align="center"><?php echo $row['dept_ID']; ?></td>
<td align="center"><?php echo $row['dept_name']; ?></td>
<td>
<button class="buttonsPromptConfirmDeleteDepartment">Delete</button>
<div id="dialogConfirmDeleteDepartmentBox" title="Confirm"></div>
<input type="hidden" class="departmentID" value="<?php echo $row['dept_ID']; ?>" />
</td>
</tr>
<?php
}
?>
</table>
<?php
}
?>
部门表
dept_ID dept_name 1 Account 2 Finance 3 Marketing
这次我在代码中添加了一个对话框
假设我的部门表只有3条记录
我的要求如下:
- 单击第一个删除按钮,显示对话框,单击确定,显示部门ID = 1
- 单击第二个删除按钮,显示对话框,单击确定,显示部门ID = 2
- 单击第3个删除按钮,显示对话框,单击确定,显示部门ID = 3
但是,无论我点击什么按钮,都会得到未定义的值。
有人可以帮助我吗?
答案 0 :(得分:2)
$(this)
var departmentID = $(this).next('input.departmentID').val();
不是指您的DOM对象,而是指当前对话框。
首先创建对DOM对象的引用,稍后可以使用它:
$(document).ready(function(){
$(".buttonsPromptConfirmDeleteDepartment").click(function(){
var $box = $(this);
...
...
click: function()
{
var departmentID = $box.parent().find('input.departmentID').val();
alert(departmentID);
}
...
...
});
});
答案 1 :(得分:0)
您可以按类名departmentID
选择输入,使用:
$(this).closest('td').find('.departmentID').val();
而不是:
$(this).next('input.departmentID').val();
希望这有帮助。