Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/86.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何将数据从html5表单发送到php页面进行处理,而无需重新加载页面或转到php页面_Php_Html - Fatal编程技术网

如何将数据从html5表单发送到php页面进行处理,而无需重新加载页面或转到php页面

如何将数据从html5表单发送到php页面进行处理,而无需重新加载页面或转到php页面,php,html,Php,Html,我正在建立一个网站,在某些部分中,我需要用户从页面中的三个选择元素中选择三个选项,然后单击搜索按钮在数据库中搜索用户想要的内容。。但是,如果不设置要提交的按钮类型,php不会从表单中获取数据。。这会导致按钮重新加载页面。。但是我不希望页面被重新加载 我曾尝试将表单的操作设置为处理数据的php文件,但这使情况变得更糟,如果点击搜索按钮,则会将用户重定向到php文件 表单的html代码 <form method="post"> <select class="select_bo

我正在建立一个网站,在某些部分中,我需要用户从页面中的三个选择元素中选择三个选项,然后单击搜索按钮在数据库中搜索用户想要的内容。。但是,如果不设置要提交的按钮类型,php不会从表单中获取数据。。这会导致按钮重新加载页面。。但是我不希望页面被重新加载

我曾尝试将表单的操作设置为处理数据的php文件,但这使情况变得更糟,如果点击搜索按钮,则会将用户重定向到php文件

表单的html代码

<form method="post">
   <select class="select_box">
     <option value="Choose a category">Choose a category</option>
     <option value="category1">category1</option>
     <option value="category2">category2</option>
     <option value="category3">category3</option>
   </select>
   <select class="select_box">
     <option value="Choose a place">Choose a place</option>
     <option value="place1">place1</option>
     <option value="place2">place2</option>
     <option value="place3">place3</option>
     <option value="place4">place4</option>
   </select>
   <select class="select_box">
     <option value="Choose budget">Choose budget</option>
     <option value="budget1">budget1</option>
     <option value="budget2">budget2</option>
     <option value="budget3">budget3</option>
     <option value="budget4">budget4</option>
   </select>
   <button type="button" name="search_btn">Search</button>
</form>


我希望页面no会根据php文件所做的搜索重新加载并显示数据,但实际情况是页面会重新加载,而预期数据会显示在为其指定的位置

您可以使用Ajax,因为它允许您在不重新加载页面的情况下更新网页

将此添加到事件中 $.ajax{ url:'yourphpfile.php', //投递 键入:“post”, 数据:{ //名称和密码可选 名称:“yourinputdata”, 密码:“yourinputpassword”。。 }, 成功:功能响应{ location.reload;//重新加载页面 }
}; 您可以使用Ajax,因为它允许您在不重新加载网页的情况下更新网页

将此添加到事件中 $.ajax{ url:'yourphpfile.php', //投递 键入:“post”, 数据:{ //名称和密码可选 名称:“yourinputdata”, 密码:“yourinputpassword”。。 }, 成功:功能响应{ location.reload;//重新加载页面 }
}; 您正在寻找的是AJAX。您要做的是使用JavaScript发布表单的内容,函数等待来自PHP页面的响应

下面是我出于这个原因使用的一段代码。您可以轻松地修改此项以适合自己的形式:

    function sendMessage(formName) {
//Put the name of your form here - make sure your FORM has a NAME and ID tag
        formIs = document.quoteSubmitForm;

          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (xhttp.readyState == 4 && xhttp.status == 200) {
             //Run this part to display the response to the user.
             innercontent = "<span class='close' onclick='closeModal()'>&times;</span>" + xhttp.responseText;
             document.getElementById("modalContent").innerHTML = innercontent;
            }

          };
//Use this to fill in the name of the PHP which you intend to POST to.
          xhttp.open("POST", "quotes/submitnew.php");
          xhttp.send(new FormData (formIs));
        }

您正在寻找的是AJAX。您要做的是使用JavaScript发布表单的内容,函数等待来自PHP页面的响应

下面是我出于这个原因使用的一段代码。您可以轻松地修改此项以适合自己的形式:

    function sendMessage(formName) {
//Put the name of your form here - make sure your FORM has a NAME and ID tag
        formIs = document.quoteSubmitForm;

          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (xhttp.readyState == 4 && xhttp.status == 200) {
             //Run this part to display the response to the user.
             innercontent = "<span class='close' onclick='closeModal()'>&times;</span>" + xhttp.responseText;
             document.getElementById("modalContent").innerHTML = innercontent;
            }

          };
//Use this to fill in the name of the PHP which you intend to POST to.
          xhttp.open("POST", "quotes/submitnew.php");
          xhttp.send(new FormData (formIs));
        }


看看javascript的fetch API看看javascript,但是我想把数据传递给php文件,以便在数据库中搜索,没错。您必须编写JS脚本,将数据发送到后端并接收一些数据作为响应,而无需重新加载pageYep这是fetch API可以做的,尽管名称不是很有用,它实际上只是一个用于AJAX调用的新接口,在这里,您可以发送和接收任何您想要的数据,而无需重新加载。查看javascript的fetch API查看javascript。但我想将数据传递到php文件,以便在数据库中搜索。没错。您必须编写JS脚本,将数据发送到后端并接收一些数据作为响应,而无需重新加载pageYep这是fetch API可以做的,尽管名称不是很有用,它实际上只是一个用于AJAX调用的新接口,您可以在其中发送和接收您想要的任何数据,而无需重新加载。。。。密码:。。。。在$.ajaxIt中引用可以是任何内容。在您的情况下,它可以是类别、地点或预算,然后在您的php文件中添加isset$\u POST['category']好的。。。似乎引号之间的内容将被发送到php文件,但如何使其生效取决于用户从选择框中选择的值。。。。为了能够在php文件中处理它并在数据库中搜索用户的请求,您可以从选择框中检索所选的值并将其保存在变量中。例如cat:$category,在php文件中:-echo$_POST['cat'];一旦你能看到自己的价值,你就可以做任何你想做的事。。。。密码:。。。。在$.ajaxIt中引用可以是任何内容。在您的情况下,它可以是类别、地点或预算,然后在您的php文件中添加isset$\u POST['category']好的。。。似乎引号之间的内容将被发送到php文件,但如何使其生效取决于用户从选择框中选择的值。。。。为了能够在php文件中处理它并在数据库中搜索用户的请求,您可以从选择框中检索所选的值并将其保存在变量中。例如cat:$category,在php文件中:-echo$_POST['cat'];一旦你能看到自己的价值,你可以做任何你想做的事。