jQuery`submit`方法忽略POST发送GET。为什么？ [英] jQuery `submit` method ignores POST sends with GET. Why?

问题描述

 < form id =hiddenFormmethod =postaction = / my-controller / my-action /enctype =multipart / form-data> 
< input type =hiddenid =HiddenFormInputname =HiddenFormInput> 
< / form> 
  

由可通过 https：// [my在服务器端，我们可以在服务器端使用这个命令，我区分 GET 和 POST 请求。或者页面显示为明显（ GET ），或者根据表单的值显示一些结果（ POST ）。

当我使用jQuery提交表单时（我没有在这里使用AJAX，只需提交表单），就像在这段代码中一样

  $（＃hiddenForm）。submit（）; 
  

然后jQuery似乎用 GET ，尽管它明确标记为使用 POST 提交。即使是一个警报（$（＃hiddenForm）。attr（method））; 总是产生post。但是，如果页面已被 GET 加载，则只会发生这种不需要的行为。如果页面来自 POST ，即表单已经提交至少一次，那么所有内容都按预期工作。

这个问题是一个简单的旧的 preventDefault（）一个。触发提交的按钮具有自己的功能。这是一个超链接。所以我有这一连串的行动。

1. 超链接到 https：// [my-server] / my-控制器/ my-action /＃


2. 使用操作提交表单 https：// [my-server] / my-controller / my -action / 。

当然这会导致 GET 在没有提交表单的情况下调用。一旦我在页面上 https：// [my-server] / my-controller / my-action /＃，超链接就失去了功能。这就是为什么第二次尝试总是奏效，因为连锁行动被缩减为提交表单。



1. 超链接到<$ code> https：// [my-server] / my-controller / my-action /＃ li>使用操作提交表单 https：// [my-server] / my-controller / my-action / 。

然后，它的工作当然。


解决方案

正如评论中所述，没有错误，至少在jQuery 2.0.3的最后一个版本中，可以用这个测试：



 < html> 
< head> 
< script src =// ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js\"> ;</script> 
< script> （'click'，function（）{
 $（＃hiddenForm）。submit（$＃$ b $（document）.ready（function（）{
 $（'＃dosubmit'）。submit （）; 
}）; 
}）; 
< / script> 
< / head> 
< body> 
 
<？php 
 // 
 if（count（$ _ GET）> 0）{
 echo< textarea style = \width： 700像素; height：90px; \> 
提交方法= GET：\ $ _GET：
; 
 var_dump（$ _ GET）; 
回显< / textarea>; 
 
 
 if（count（$ _ POST）> 0）{
 echo< textarea style = \width：700px; height：90px; \> 
用method = POST提交：\ $ _POST：
; 
 var_dump（$ _ POST）; 
回显< / textarea>; 
} 
？> 
 
< form id =hiddenFormmethod =postenctype =multipart / form-data> 
< input type =hiddenid =HiddenFormInputname =HiddenFormInput/> 
< / form> 
 
< div id =dosubmitstyle =background-color：gold; width：200px; cursor：pointer;> Click me to Do jQuery Submit< / div> 
 
< / body> 
< / html> $（b 
 
 
 
 
 
当点击黄金背景文本时，$（＃hiddenForm）。submit（）;用于提交表格。
 
 
 
以下是输出： 
 
 
 用method = POST提交：$ _POST：
 array（1）{
 [HiddenFormInput] => 
 string（0）
} 
  
由于只有提供了具有指定的name属性的输入，URL提交才会传递URL参数。因此，我为您的隐藏输入添加了属性name = HiddenFormInput 。
 
I have a form like this.
<form id="hiddenForm" method="post" action="/my-controller/my-action/" enctype="multipart/form-data">
    <input type="hidden" id="HiddenFormInput" name="HiddenFormInput">
</form>
which is produced by a web page accessible through https://[my-server]/my-controller/my-action/, which is also the action the form points to.

On the server side, I differentiate between GET and POST requests. Either the page is shown plainly (GET) or some results are shown depending on the form's values (POST).

When I use jQuery to submit the form (I am NOT employing AJAX here, simply submitting the form), as in this snippet,
$("#hiddenForm").submit();
then jQuery seems to submit this form with GET, although it's clearly marked to be submitted with POST. Even an alert($("#hiddenForm").attr("method")); always yields "post". However, this unwanted behaviour only occurs if the page has been loaded by a GET. If the page came by a POST, i.e. the form has already been submitted at least once, everything works just as expected.

Update

The problem was a plain old preventDefault() one. The button that triggered the submit had a functionality of its own. It was a hyperlink. So I had this chain of actions.

Hyperlink to https://[my-server]/my-controller/my-action/#
Submit form with action https://[my-server]/my-controller/my-action/.
Of course that would result in a GET call without the form being submitted. Once I was on the page https://[my-server]/my-controller/my-action/# the hyperlink lost it's functionality. That's why the second try always worked because the chain of actions was reduced to the submission of the form.

Hyperlink to https://[my-server]/my-controller/my-action/# (no effect because already there)
Submit form with action https://[my-server]/my-controller/my-action/.
Then it worked of course.
解决方案
As discussed in comments, there is no bug, at least on the last version of jQuery 2.0.3, one can test with this:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
$(document).ready(function () {
  $('#dosubmit').on('click',function(){
    $("#hiddenForm").submit();
  });
});
</script>
</head>
<body>

<?php
//
if(count($_GET) > 0) {
  echo "<textarea style=\"width: 700px; height: 90px;\">
Submitted with method=GET: \$_GET:
";
  var_dump($_GET);
  echo "</textarea>";
}

if(count($_POST) > 0) {
echo "<textarea style=\"width: 700px; height: 90px;\">
Submitted with method=POST: \$_POST:
";
  var_dump($_POST);
  echo "</textarea>";
}
?>

<form id="hiddenForm" method="post" enctype="multipart/form-data">
  <input type="hidden" id="HiddenFormInput" name="HiddenFormInput" />
</form>

<div id="dosubmit" style="background-color: gold; width: 200px; cursor: pointer;">Click me to Do jQuery Submit</div>

</body>
</html>
When one clicks on gold background text, $("#hiddenForm").submit(); is used to submit the form.

Here is the output:
Submitted with method=POST: $_POST:
array(1) {
  ["HiddenFormInput"]=>
    string(0) ""
}
In your original form, no URL arguments are passed by the submitting, as only inputs with name attribute specified are submitted. So I added the attribute name="HiddenFormInput" for your hidden input.

                        
这篇关于jQuery`submit`方法忽略POST发送GET。为什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！