AJAX POST和PHP POST在同一页面
[英]AJAX POST & PHP POST In Same Page
问题描述
I have 2 dropdowns called drpcategory and drpitem as below; 
我有2个下拉菜单，分别称为drpcategory和drpitem ，如下所示；
<div class="form-group">
<label>Category</label>
<select class="form-control bg-dark btn-dark text-white" id="drpcategory" name="drpcategory" required>
<?php
$category = ''.$dir.'/template/post/category.txt';
$category = file($category, FILE_IGNORE_NEW_LINES);
foreach($category as $category)
{
echo "<option value='".$category."'>$category</option>";
}
?>
</select>
</div>
<div class="form-group">
<label>Item</label>
<select class="form-control bg-dark btn-dark text-white" id="drpitem" name="drpitem">
<?php
$category = $_POST["drpcategory"] ?? 'Electronics';
$item = ''.$dir.'/template/post/'.$category.'/item.txt';
$item = file($item, FILE_IGNORE_NEW_LINES);
foreach($item as $item)
{
echo "<option value='".$item."'>$item</option>";
}
?>
</select>
</div>
As you can see, depending on the selected value of drpcategory , the drpitem should be dynamically populated. 如您所见，根据drpcategory的选定值，应该动态填充drpitem 。
In case you were wondering, both dropdowns will go through the PHP loop and populate if I set $category manually without any post checks. 如果您想知道，两个下拉列表都将经过PHP循环并填充，如果我手动设置$category而不进行任何post检查。
Now, I'm using AJAX post to post the changes in drpcategory into the same page as below; 现在，我使用AJAX post将drpcategory的更改drpcategory到同一页面中，如下所示；
<script>
$(function(){
$('#drpcategory').on('change',function()
{
$.ajax({
method: 'post',
data: $(this).serialize(),
success: function(data)
{
alert(data);
}
});
});
});
</script>
Here is the Chrome Browser > Inspect > Network tab output for the above AJAX post ; 这是上述AJAX post的Chrome浏览器> 检查 > 网络标签输出；
And yes, I'm post ing this AJAX into the same page and the url is: http://example.com/?page=post which is the same as this Network tab shows. 是的，我post这个AJAX发布到同一页面中，其url为： http://example.com/?page=post : http://example.com/?page=post page= post ，它与此“网络”标签显示的相同。
I have removed the url field from AJAX function because the browser automatically picks up the current page so it's better, and no, manually writing any url in there didn't change anything about what I'm about to ask below. 我已从AJAX函数中删除了url字段，因为浏览器会自动选择当前页面，因此效果更好，不，在其中手动编写任何url不会改变我在下面要问的内容。
Question is, how can I make that drpitem to pickup the AJAX post ed drpcategory value and start populating dynamically? 问题是，如何使该drpitem提取AJAX post drpcategory值并开始动态填充？
I want to AJAX post to the same page and all of this should happen without a page reload. 我想将AJAX post到同一页面，并且所有这些都应该在不重新加载页面的情况下发生。
2 个解决方案
解决方案1
0 2019-03-06 05:13:29
You get return of all html elements? 你得到所有的HTML元素的回报？ Please make 'if condition' in your php function if Post request occur return php result else return html elements. 如果发帖请求发生，请在您的php函数中添加“如果条件”，则返回php结果，否则返回html元素。 Whats is the '/?page=post' in your url ? 您的网址中的“ /？page = post”是什么？ please var_dump($_POST,$_GET); 请var_dump（$ _ POST，$ _ GET）; in ajax request function please give me the response. 在ajax请求功能中，请给我答复。 Otherwise can you please send this request to newly created function for test propose? 否则，您可以将此请求发送到新创建的功能以进行测试建议吗？
解决方案2
0 已采纳 2019-03-06 08:15:31
Finally after waiting more than 7 days trying to figure this out, I couldn't AJAX post to the same page probably because there are too much of <html> elements already in the same page. 最终，在等待了7天以上的时间来解决这个问题之后，我无法将AJAX post到同一页面，这可能是因为同一页面中已经存在太多的<html>元素。 But here goes it using an external post.php file. 但是这里使用外部post.php文件。 Only these changes were required for me to get this working other than mentioned in my original question above. 除了上面我最初的问题中提到的以外，我仅需要进行这些更改即可工作。
<script>
$(function()
{
$('#drpcategory').change(function()
{
$.ajax({
method: 'post',
url: 'post.php',
data: $(this).serialize(),
success: function(data)
{
$('#drpitem').html(data);
}
});
});
});
</script>
Then I had to save this post.php in the root website directory where index.php is located. 然后，我必须将此post.php保存到index.php所在的根网站目录中。 Change your directory as necessary and also remember to change the url field in the above AJAX function. 根据需要更改目录，并且还记得更改上述AJAX函数中的url字段。
<?php include 'config.php';?> //this is where the $dir variable is derived in my website. i had to include this since post.php is an external file that doesn't know about the variable.
<?php
$category = $_POST["drpcategory"];
$item = ''.$dir.'/template/post/'.$category.'/item.txt';
$item = file($item, FILE_IGNORE_NEW_LINES);
foreach($item as $item)
{
echo "<option value='".$item."'>$item</option>";
}
?>
Thank you for each and everyone of you for walking me through this. 感谢你们每个人都引导我完成此任务。 I would have marked someone of you as the answer if a direct answer was given but if someone already given this, I'm sorry for not understanding you properly. 如果给出直接答案，我会标记您中的某个人为答案，但是如果有人已经给出了答案，对不起您未能正确理解您。 But I think the end goal is for someone to use this as help. 但我认为最终目标是让某人以此作为帮助。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.