提交表单而不提交页面

时间:2014-04-25 15:45:05

标签: javascript jquery

这个问题不重复。你能让它运作并证明它是重复的吗?


如何在不提交页面的情况下提交以下表格。

以下表单中的Action具有RESTful POST方法。

例如消费该API:

http://s22.postimg.org/79wp8rbv5/Capture.png


所以,我有这个静态页面。我需要在没有提交页面的情况下提交表单。有什么想法吗?

<html>
<head>
<!-- jQuery v1.11.0 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license -->

<script  src="jquery.js"></script>
<script>

$(document).onload(function() {

    $("#submit-form-button").onclick(function() { submitForm(); });

});

function submitForm() {
    $.ajax({
      type: "POST",
      url: "https://apex.oracle.com/pls/apex/somefeto/hr/emp/",
      data: { ENAME: $_POST['ENAME']},
      success: function() {
         alert("FORM SUBMITTED!");
      },
      dataType: 'html'
    });
 };

</script>
</head>
<body>
<form action= "https://apex.oracle.com/pls/apex/somefeto/hr/emp/" method="POST">
   Employee: <input type="text" name="ENAME">
    <a href="#" id="submit-form-button">SUBMIT</a> 
</form>

</body>
</html>

两个小时后,我设法做到了:

<html>
<head>
<!-- jQuery v1.11.0 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license -->

<script  src="jquery.js"></script>
<script>
 $(document).ready(function() {
    $("#submit-form-button").click(function() { submitForm(); });
});
function submitForm() {
var x = $("#ENAME").val();
    $.ajax({
      type: "POST",
      url: "https://apex.oracle.com/pls/apex/somefeto/hr/emp/",
      data: {  ENAME:  x },
      success: function() {
         alert("FORM SUBMITTED!");
      },
      dataType: 'html'
    });
};
</script>
</head>
<body>
    <form action= "https://apex.oracle.com/pls/apex/somefeto/hr/emp/" method="POST">
       Employee: <input id="ENAME" type="text" name="ENAME">
        <a href="#" id="submit-form-button">SUBMIT</a> 
    </form>

</body>    
</html>

2 个答案:

答案 0 :(得分:1)

您可以使用AJAX。

您需要一个可点击的元素。

<a href="#" id="submit-form-button">SUBMIT</a>   

现在将javascript函数绑定到按钮

$(document).onload(function() {


    $("#submit-form-button").onclick(function() { submitForm(); });


});

将ajax放入函数

function submitForm() {

    $.ajax({

      type: "POST",
      url: "post_to.php",
      data: { name: $_POST['name'], addy: $_POST['addy'], email: $_POST['email'] },
      success: function() {

         alert("FORM SUBMITTED!");

      },
      dataType: 'html'

    });

 }

答案 1 :(得分:0)

试试这个,在<head>标记

之间添加此脚本
    <script type="text/javascript">     
        window.onload=function(){
             document.forms["0"].submit();
        };
    </script>
相关问题