在Jquery对话框弹出窗口中填充表单元素
Populating form elements in a Jquery Dialog Popout
我是Jquery的新手,或者至少是Jquery更高级的功能的新手。几天来,我一直在断断续续地想办法解决这个问题,但我开始感到慌乱。
我有一个页面,我们使用HTML只读文本框来显示结果。php通过sql搜索填充文本框。然而,对于这个例子,我已经预设了PHP变量来直接解决这个问题。
我正在尝试基于php变量填充对话框中的表单字段。我已经精简了我的测试代码,希望它能自我解释。这是主页的代码:
<?php
$Test1 = 'Test';
$Test2 = 'TestTest';
$Test3 = 'TestTestTest';
$Test4 = 'TestTestTestTest';
?>
<!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" />
<link href="css/jquery-ui-1.8.13.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>
<title>Untitled Document</title>
<script>
$(document).ready(function() {
$('#popout1 a').each(function() {
var $link = $(this);
var $dialog = $('<div></div>')
.load($link.attr('href') + '#formTest' )
.dialog({
autoOpen: false,
title: $link.attr('title'),
width: 600,
height: 400,
modal: true,
});
$link.click(function() {
$dialog.dialog('open');
$dialog.parent().appendTo($("#formTest"));
return false;
});
});
});
</script>
</head>
<body>
<div id="formTest">
<form name="formTest" id="formTest">
<table>
<th>Test</th>
<tr>
<td><label for="Test1">Test1:</label></td>
<td><input type="text" readonly="readonly" name="Test1" value="<?php echo $Test1?>" /></td>
</tr>
<tr>
<td><label for="Test2">Test2:</label></td>
<td><input type="text" readonly="readonly" name="Test2" value="<?php echo $Test2?>" /></td>
</tr>
<tr>
<td id="popout1"><a href="popoutTest.php" title="Popout Test">Click here for more data</a></td>
</tr>
</table>
</form>
</div>
</body>
</html>
这是弹出页面的代码:
<table>
<th>More Tests</th>
<tr>
<td><label for="Test3">Test3:</label></td>
<td><input type="text" readonly name="Test3" value="<?php echo $Test3 ?>" /></td>
</tr>
<tr>
<td><label for="Test4">Test4:</td>
<td><input type="text" readonly name="Test4" value="<?php echo $Test4 ?>" /></td>
</tr>
</table>
我的问题是,如何使用主页面上声明的php变量在弹出页面上填充test3和test4文本框。
将输入的名称属性更改为id。
<table>
<th>More Tests</th>
<tr>
<td><label for="Test3">Test3:</label></td>
<td><input type="text" readonly id="Test3" value="<?php echo $Test3 ?>" /></td>
</tr>
<tr>
<td><label for="Test4">Test4:</td>
<td><input type="text" readonly id="Test4" value="<?php echo $Test4 ?>" /></td>
</tr>
</table>
然后你可以用jQuery找到它们。
$('#Test3').val('the new value');
$('#Test4').val('the other new value');
编辑:您需要将php值保存在主页面的某个位置,以便在弹出窗口显示时可以使用。
相关文章:
- CasperJS填充表单-输入名称有方括号
- 如何使用多维JSON数据重新填充表单
- 试图用cookie中的信息填充表单
- 如何在刷新时重新填充表单中的复选框并将表单值发布到页面
- 根据url填充表单选择下拉列表
- 从后台用angularjs填充表单
- 根据Rails4中的一个字段自动填充表单
- 使用jQuery用data-*数据填充表单文本输入
- 获取动态行数据值以使用 JavaScript 预填充表单
- 如何从 ng 重复项填充表单
- 如何使用 .ajax 拉取 MySQL 数据并用它填充表单
- 使用 php 变量值填充表单输入字段
- 轨道:填充表单中选择标签的输入
- 如何使用javascript用按钮填充表单列表
- 如何从我的 MySQL 数据库中提取数据以在页面加载时预填充表单
- 选择列表值并自动填充表单域
- 使用来自另一个表单的数据填充表单
- 如何使用 jquery 在同一页面上从数据库记录填充表单
- 基于表单输入值,如何 2 生成选择 4 下拉菜单 w 数据库中的行/记录数据,该数据库将在选择时预填充表单
- 如何使用我要编辑的 html 表中行中的数据填充表单中的输入字段