使用来自另一个表单的数据填充表单
Populate form with data from another form
>我有一个小游览的页面,在游览点内是输入。此页面上还有另一种表单,这些表单具有相似的输入,包括名字、姓氏等......
如果用户在表单1 中输入他们的名字,如何填充表单 2 的名字字段?
这是表格 1:
<form role="form" id="inviteform3" class="form-inline" action="name.php" method="POST">
<div class="form-group">
<input type="text" class="form-control input-sm" name="name" placeholder="First Name"
id="hello" autocomplete="off" style="margin-top:10px">
</div>
<center>
<span id="start">Let's get started, <span id="result"></span></span>
<button class="btn btn-brand btn-sm next-screen animated bounceInUp"
id="go" style="margin-top:5px; display:none" href="#services" data-animation-delay=".5s">
Let's Go!</button></center>
<button class="btn btn-block btn-brand btn-xs invitebtn3" id="casi" type="submit"
style="margin-top:5px"><i class="fa fa-thumbs-o-up"></i> Submit</button>
</form>
这是表格 2:
<form role="form" id="inviteform" class="form-inline"
action="http://omnihustle.net/demo/invitations/invite_request" type="POST"><div
class="form-group">
<input type="text" class="form-control input-sm" id="InputFirstName" placeholder="First
Name">
</div>
<div class="form-group">
<input type="text" class="form-control input-sm" id="InputLastName" placeholder="Last
Name">
</div>
<div class="form-group">
<input type="email" class="form-control input-sm" id="InputEmail" placeholder="Email">
</div>
<button class="btn btn-brand btn-sm invitebtn" type="submit" data-toggle="modal" data-
target=".bs-example-modal-sm"><i class="fa fa-check fa-fw"></i> Invite Me</button></form>
这是我的 php 文件,表单被发送到:
<html>
<body>
<?php session_start(); ?>
<?php
if (isset($_POST['name']) && !empty($_POST['name'])) {
$_SESSION['name'] = $_POST['name'];
}
?>
<?php echo $_POST["name"]; ?>
</body>
</html>
Jquery 不起作用,因为我无法在表单的"值"字段中输入 html,那么有什么替代方案呢?
这是我尝试过的;
<script>
$(document).on("ready", function(){
//Form action
$("#inviteform3").on("submit", function(event){
// Stop submit event
event.preventDefault();
$.ajax({
type:'POST',
url: 'name.php',
data:$('#inviteform3').serialize(),
success: function(response)
{
$('#inviteform3').find('#result').html(response);
$('.coupontooltip5').find('#result2').html(response);
$('#announcement').find('#result3').html(response);
$('#announcement2').find('#result4').html(response);
$('#progressbutton').find('#result5').html(response);
$('#inviteform').find('#result6').html(response);
}});
});
});
</script>
我尝试将"span id="result6"输入到输入的"value"标签中,表单不允许该功能,只是将html显示为输入的默认值。
您可以添加一个将内容复制到第二个字段的"keyup"处理程序。将以下行添加到"就绪"处理程序中。
$('#hello').on('keyup', function() {
$('#InputFirstName').val($(this).val());
});
如果添加"更改"处理程序而不是此"keyup"处理程序,则仅在字段失去焦点后调用该处理程序。
顺便说一下,name.php不起作用。 在进行任何输出之前,必须调用 session_start()。因此:
<?php session_start(); ?>
<html>
<body>
相关文章:
- 单击鼠标,用MySQL数据填充html表单输入字段
- 通过浏览器对表单自动填充做出反应
- 谷歌表单-根据分配给谷歌应用程序的工作为商业用户预先填充多项选择列表
- 提交表单时,Javascript(JQuery)不会在文本区域中填充内容
- Javascript未在开发服务器上填充Perl表单
- 如何在js中实现树结构类型的表单动态填充
- CasperJS填充表单-输入名称有方括号
- 如何使用多维JSON数据重新填充表单
- 试图用cookie中的信息填充表单
- 如何在刷新时重新填充表单中的复选框并将表单值发布到页面
- 单击一个数据表,填充第二个数据表
- 将表单填充到要与ngMessages一起使用的templateURL中
- jQuery表单填充器不工作
- Rails 输入表单填充了 jQuery .val(),但参数中不存在数据
- 使用自动填充表单控件(自动完成属性),加快表单填充速度
- HTML5地理位置地址表单填充器未捕获语法错误:意外的标记<
- 使用AJAX调用进行表单填充和验证
- 在检索数据时,表单填充然后清除
- 基于浏览器的客户端表单填充
- 从Google表单填充HTML表单