【问题标题】:How can i submit a form and go to another page when its done? [closed]我如何提交表单并在完成后转到另一个页面? [关闭]
【发布时间】:2013-02-03 05:23:05
【问题描述】:

我有这个表格

您的电子邮件

收件人电子邮件

主题

消息 b>

如何提交此数据并转到另一个页面(使用任何标记的语言)?请帮忙。

【问题讨论】:

  • 你可能想learn about Ajax。 Ajax 允许您在不离开当前页面的情况下提交内容。您可以(可选)处理 JS 中的响应。然后您可以导航到您选择的页面。
  • 1.学习 html/javascript。 2.使用ajax。
  • 问题说“没有”去那个页面,在你的消息底部,你提到“去另一个页面”。是哪个?
  • 您要提交表单并转到另一个页面,还是提交表单而不转到另一个页面?标题与正文冲突。
  • 对不起!我想提交表单并转到我网站上的另一个页面

标签: php javascript jquery html ajax


【解决方案1】:

如果我的问题没有错,你的答案是:

您的提交按钮必须是这样的:

<form method="POST" action="file.php">
    <!-- Whatever data you want to submit -->
    <input type="submit" value="Submit">
</form>

而且你的 PHP file.php 必须是:

<?php
   if(isset($_POST['submit']))
   {
    //Do all the submission part or storing in DB work and all here
    header('Location: whateverpath.php');
   }
?>

如果这是你想要的,请告诉我

【讨论】:

  • location.href 不会提交表单,也不会将数据传输到下一页。您必须使用 POST 或 GET 方法提交表单。
  • 哦,抱歉,忘记看到他的 JS 标签了。现在应该有帮助了。
  • 记得在调用header('Location...')之后总是调用exit();。否则,将执行脚本的其余部分,这在大多数情况下几乎不是您所期望的。
【解决方案2】:

如果您只使用 PHP 来完成任务,请使用以下代码重定向到另一个页面。

header('Refresh: 5; URL= navigated.php'); 

这里,5 是用于重定向的刷新计时器,并且 URL 定义了您想去的地方。别忘了一件事,千万不要在这个头函数之前写一个echo语句。

如果你想通过 javascript 或 jquery 来完成,请在末尾添加以下行。

window.location.href=navigated.php;

在这里,navigated.php 是您要重定向的页面。

祝你好运!

【讨论】:

    【解决方案3】:

    从页面 A 到页面 B(PHP) 然后到页面 C 的替代方法是从 A 到 B 提交一个 ajax 帖子,验证,然后直接进入页面 C。这样做的好处是你可以这样做服务器端验证(发生在页面 B),并在页面 A 上警告您的用户,而无需离开或重新加载它。否则,您将不得不从 A 到 B,然后再返回 A。

    <script>
    $(function() {
            $('form').submit(function() {
                    //Initial validation
                    if($('#input1').val()=="")
                    {
                        alert("field is blank!");
                        return false
                    }
                    //After validating form, send to page B
                    $.post('PageB.php', {
                            'field1': $('#input1').val(),
                            'field2': $('#input2').val()
                            //etc
                        }, function (data) {
                            //Validate the response from Page B
                            if (data!="success")
                            {
                                alert("Error:"+data);
                            }
                            else
                            {
                                //Go to Page C if Page B was successful
                                window.location.href = "nextpage.html";
                            }
                        });
            return false;
        });
    </script>
    

    【讨论】:

      【解决方案4】:

      使用 JQuery 和 AJAX 以及 JSP servlet 或 PHP 等服务器端脚本类型非常容易。在我的例子中,我使用 JSP 作为服务器端脚本,并使用 JQuery 的 AJAX 支持提交到服务器端脚本。

      服务器端组件的代码在这里..

      page2.jsp

          <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
      
          <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
          <html>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
          <title>Insert title here</title>
          </head>
          <body>
      
          <h1 style="color:red">Contents from Page 2</h1>
          <%=request.getParameter("parmeter")%>
          </body>
          </html>
      

      客户端脚本的代码在这里..

      pag1.html

          <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
          <html>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
          <title>Insert title here</title>
          </head>
          <body>
          <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
             <script>       
                function submitRequest(){
      
                   var v= document.getElementById("test1").value;
                   alert(v);
                    $.ajax({url:"page2.jsp?parmeter="+v,
                          error: function (xhr, ajaxOptions, thrownError) {
      
                              alert("fail");
                              alert(xhr.status);
                              alert(thrownError);
                         },
                          success:function(result){
                                alert("sucesses");
                                $("#mydiv").html(result);
                          }
                        });
                }
      
              </script>
      
          </body>
      
      
          <form>
              <!-- Whatever data you want to submit -->
              <input type="text" id="test1"><br>
              <input type="button" value="Submit" onclick="submitRequest()">
          </form>
      
          <div id="mydiv">
          Contents of Page 2 jsp will be displayed here
          </div>
          </html>
      

      单击提交后,在文本框中输入的内容将提交给函数submitRequest(),并且该函数对另一个页面进行AJAX 调用,将请求提交给page2.jsp。 page2.jsp 只显示接收到的参数,因此我们可以选择在当前页面上显示 page2 的结果,方法是在 success 的 AJAX 回调函数中进行编码,如上所示。

      它将当前页面的内容替换为通过 AJAX 请求请求的页面。表明我们可以将详细信息提交到其他页面

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-06-26
        • 1970-01-01
        • 1970-01-01
        • 2020-10-22
        相关资源
        最近更新 更多