(PHP) 如何使输入隐藏数据从输入框中获取值

Question

您好，我尝试通过 Stack 研究我的问题大约 3 小时，但仍然没有找到。 所以我决定创建一个主题来询问我的问题。

我正在创建搜索引擎，结果如下：

1. 如果我在输入表单中输入测试文本，然后从键盘单击“输入”按钮，搜索结果将正常工作。
2. 如果我在输入表单中输入测试文本，然后单击网页上的“搜索”按钮，搜索结果无效。

我的问题是结果 2。

这是我的代码：

 <form action="search_content.php" method="POST" >  
    <div class="input-group mainsearch-home">           
         <input type="text" class="input-group-field" name="homesearchfield" id="homesearchfield2" placeholder="What are you looking for?" autocomplete="off">
         <div class="input-group-button">
              <button type="button" class="button button--search" >search</button>              
              <input type="hidden" name="homesearchfield" value="search">
         </div>
    </div>
 </form>

我做错了什么？ 我认为我的问题出在输入类型隐藏数据。 所以我想知道如何从输入文本框中获取值并将值发送到我的目标页面。

我在下面的“响应”页面中添加了一些 php 代码。

 $viewstate = isset( $_POST["homesearchfield"] ) ? $_POST["homesearchfield"] : "" ;
 $sql="SELECT *  FROM `article` WHERE topic_article LIKE '%$viewstate%' order by id_article DESC";

Answer 1

目前您的表单不知道该按钮是用来提交表单的，可以通过更改按钮上的类型来解决此问题：

<button type="submit" class="button button--search" >search</button>

你也可以使用：

<input type="submit" class="button button--search" value="search" />

Answer 2

控制数据的一个选项是使用 JavaScript / jQuery 来控制表单的操作。通过这种方式，您还可以在实际发送之前查看正在发布的数据，您甚至可以评论该帖子，然后使用您希望返回的正确数据来获取表单。

为了使序列化工作，您需要为要传回数据的每个项目命名。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script lang="JavaScript">
$(function(){
    $("#button").click(fuction()
    {
        var formData = $("#form").serialize();
        alert(formData);
        /*
        $.post({"search_content.php",
                formData,
                function(returndata)
                {
                    //do something

                    //this will load the return data into the div tag on the fly
                    $("#divReturn").html(returndata); 
                },
                "text"
          });
          //*/
    });

});
</script>
<form id="form" onsubmit="return false;" >  
    <div class="input-group mainsearch-home input-group--search inputs--raspberry">         
         <input type="text" class="input-group-field" name="homesearchfield" id="homesearchfield2" placeholder="What are you looking for?" autocomplete="off">
         <div class="input-group-button">
              <button type="button" class="button button--search" id="button" name="button" value="search" >search</button>              
         </div>
    </div>
</form>
<div id="divReturn">
</div>