Php 单击按钮提交输入字段值
我正在使用一个ajax表单,它应该通过单击按钮提交。我见过类似的项目,但我正陷入死胡同。我遇到的问题是,输入字段值在选项卡2中没有得到回音。我设置了一个参数var currentTab,以指示并比较单击下一个选项卡的时间 单击后如何显示输入字段的值? 另外,如果将来我有多个带有输入字段的选项卡,而最后一个选项卡将是获取php echo值的地方,那么如何调整代码? 多谢各位 AJAX/JS函数 PHP HTML选项卡2是输出结果的地方Php 单击按钮提交输入字段值,php,javascript,jquery,ajax,Php,Javascript,Jquery,Ajax,我正在使用一个ajax表单,它应该通过单击按钮提交。我见过类似的项目,但我正陷入死胡同。我遇到的问题是,输入字段值在选项卡2中没有得到回音。我设置了一个参数var currentTab,以指示并比较单击下一个选项卡的时间 单击后如何显示输入字段的值? 另外,如果将来我有多个带有输入字段的选项卡,而最后一个选项卡将是获取php echo值的地方,那么如何调整代码? 多谢各位 AJAX/JS函数 PHP HTML选项卡2是输出结果的地方 <div id="tab-1" class="ui-ta
<div id="tab-1" class="ui-tabs-panel ui-tabs-hide">
<label for="title">Title</label>
<input type="text" id="title_input" name="title_input" size="60" autocomplete="off" value="<?=$title?>"/><br>
<label for="textarea_input">Textarea</label>
<textarea id="textarea_input" name="textarea_input"><?=$textarea?></textarea>
</div>
<div id="tab-2" class="ui-tabs-panel ui-tabs-hide">
<div id="title_result" style="padding:20px;"></div>
<div id="textarea_result" style="padding:20px;"></div>
</div>
几点意见:
您应该首先从PHP添加回显html,然后才能使用$resultval从jquery访问它
我会解释-看看你的成功管理者
success: function(result) {
$('#textarea_result').html( $('#resultval', result).html());
$('#title_result').html( $('#resultval', result).html());
}
代码应该是
success: function(result) {
$('#textarea_result').html( result);
$('#title_result').html( result);
}
如果有的话。。但我不认为这就是你的意思
如果你想问我-在PHP中呈现整个下一个选项卡,并执行类似$tab2.htmlresult的操作
评论2
您有两个相同的ID-resultval
评论3-
您正在用Ajax发送textarea和title,但参考了$\u POST[textarea\u input]和$\u POST[title input]
评论4-
您正在使用$textarea-input.html来获取值,而不是$textarea-input.val。标题输入相同
这是我的工作版本,只是去掉头部的东西
这是我的main.php-
<html>
<head>
<link rel="stylesheet" type="text/css" href="/stackoverflow/public/jquery-ui-1.8.22.custom.css" media="screen" />
<script src="/stackoverflow/public/jquery-1.7.2.min.js"></script>
<script src="/stackoverflow/public/jquery-ui-1.8.22.custom.min.js"></script>
</head>
<body>
<div id="page-wrap">
<div id="tabs">
<ul>
<li><a href="#tab-1"> TAB1</a></li>
<li><a href="#tab-2"> TAB2</a></li>
</ul>
<div id="tab-1" class="ui-tabs-panel ui-tabs-hide">
<label for="title_input">Title</label>
<input type="text" id="title_input" name="title_input" size="60" autocomplete="off" value="my title"/><br>
<label for="textarea-input">Textarea</label>
<textarea id="textarea-input" name="textarea-input"></textarea>
</div>
<div id="tab-2" class="ui-tabs-panel ui-tabs-hide">
</div>
</div>
</div>
<script>
var currentTab = 0;
$(function() {
var $tabs = $('#tabs').tabs({
disabled: [0, 1]
, select: function() {
console.log("selecting a new tab " + currentTab);
if (currentTab == 0) {
$.ajax({
type: "POST",
url: "tabs.php",
data: { "textarea": $("#textarea-input").val(),
"title": $("#title_input").val()
},
success: function(result) {
$("#tab-2").html(result);
}
});
}
}
, show: function(event, ui) {
currentTab = ui.index;
}
});
$(".ui-tabs-panel").each(function(i) {
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("<a href='#' class='next-tab mover' rel='" + next + "'>Next Page »</a>");
}
if (i != 0) {
prev = i;
$(this).append("<a href='#' class='prev-tab mover' rel='" + prev + "'>« Prev Page</a>");
}
});
$('.next-tab, .prev-tab').click(function() {
var tabIndex = $(this).attr("rel");
$tabs.tabs('enable', tabIndex)
.tabs('select', tabIndex)
.tabs("option","disabled", [0, 1]);
return false;
});
});
</script>
</body>
</html>
这是我的tabs.php
我的工作示例可以在
如果还有别的事,请告诉我 您可能希望首先清理HTML并正确使用PHP。。。您的HTML选项卡2应该是:
<div id="tab-1" class="ui-tabs-panel ui-tabs-hide">
<label for="title">Title</label>
<input type="text" id="title_input" name="title_input" size="60" autocomplete="off" value="<?=$title?>"/><br>
<label for="textarea-input">Textarea</label>
<textarea id="textarea-input" name="textarea-input"><?=$textarea?></textarea>
</div>
<div id="tab-2" class="ui-tabs-panel ui-tabs-hide">
<div id="title_result" style="padding:20px;"></div>
<div id="textarea_result" style="padding:20px;"></div>
</div>
if (isset($_POST['title_input'])){
$title = $_POST['title_input"'];
echo ('<div id="title_result"><span id="resultval"><h2>Title Echo result:</h2>'.$title.'</span></div>');
}
浏览并清理代码类似的帖子:我们正在谈论Ajax。单击“提交”不会重新加载页面。您应该使用$textarea-input.val而不是$textarea-input.html-您的输入根本不会发送到服务器。。看看你的网络调用。PHP代码应该从你开始是不一致的。有时是文本区域输入,有时是标题输入-检查所有输入,确保它们都对齐。下划线更好。+1谢谢,我根据您的答案和Jeffrey A Woody编辑了代码。但是现在我得到了不正确的php回音。是的,我知道-您还有一些语法错误。请看一看我的评论,我正在发布一个你的代码的工作版本。感谢你耐心地指导我完成语法错误的代码。我遵循每一步,似乎工作,但例外的是,这是呼应一些额外的。请检查一下。有什么额外的东西是echo'd的?这是我用来调试的。你可以删除它。+1谢谢你,我已经根据你的回答这样做了。现在我遇到了一个不同的问题。我很乐意帮助。。。但是,修改代码后的新问题是什么?编辑您的问题,并在原始评论后发布最新问题
<?php
echo "This is the result are you ready?";
if (isset($_POST['title'])){
$title = $_POST['title'];
echo ('<div id="title_result"><span id="resultval"><h2>Title Echo result:</h2>'.$title.'</span></div>');
}
else{
echo "title_input is not defined!";
}
if (isset($_POST['textarea'])){
$textarea = $_POST['textarea'];
echo ('<div id="textarea_result"><span id="resultval"><h2>Textarea Echo result:</h2>'.$textarea.'</span></div>');
}
?>
<div id="tab-1" class="ui-tabs-panel ui-tabs-hide">
<label for="title">Title</label>
<input type="text" id="title_input" name="title_input" size="60" autocomplete="off" value="<?=$title?>"/><br>
<label for="textarea-input">Textarea</label>
<textarea id="textarea-input" name="textarea-input"><?=$textarea?></textarea>
</div>
<div id="tab-2" class="ui-tabs-panel ui-tabs-hide">
<div id="title_result" style="padding:20px;"></div>
<div id="textarea_result" style="padding:20px;"></div>
</div>
<?=$title?>
if (isset($_POST['title_input"'])){
$title = $_POST['title_input"'];
echo ('<div id="title_result"><span id="resultval"><h2>Title Echo result:</h2>'.$title.'</span></div>');
}
if (isset($_POST['title_input'])){
$title = $_POST['title_input"'];
echo ('<div id="title_result"><span id="resultval"><h2>Title Echo result:</h2>'.$title.'</span></div>');
}
$_POST['title_input"']