在Vue App中使用Axios发布数据后尝试更新PHP查询

时间:2018-11-06 16:07:10

标签: javascript php post vue.js axios

我正在通过名为BullHorn的服务通过PHP查询获取JSON对象,如下所示:

         onSubmit () {

       axios.post('/wp-content/themes/bones/library/jobsResponse.php',{region: this.selectedLocation}, {headers: {'X-Requested-With': 'XMLHttpRequest', 'Content-type': 'application/x-www-form-urlencoded'}})
       .then(function(response){
         console.log(response)
       })
       .catch(function(error){console.log(error)})
}

但是,需要根据用户输入对JSON对象进行过滤。因此,我在Vue应用程序中创建了输入,以获取用户输入值,然后尝试将该值发布到PHP。我的Axios代码如下:

this.selectedLocation

所以这是当单击表单按钮时onSubmit()函数运行的原因。然后,它使用Axios将数据发布到jobsResponse.php文件。当前要发布的数据是

$request_body = file_get_contents("php://input");
$data = json_decode($request_body, true);
$region = $data['region'];

这就是我Vue应用程序中的一个数据变量,它与用户可以使用的下拉输入连接。

然后在我的jobResponse.php文件中,我有:

<?php echo getBhQuery('search','JobOrder','isOpen:true AND region:"Chicago Region"','id,title,categories,dateAdded,externalCategoryID,employmentType,customText12'); ?>

因此它将获取发布的数据并将其分配给$ region变量。我最大的问题是更新PHP查询以添加过滤。要按地区过滤查询,我将查询编辑成类似这样的内容:

{{1}}

添加的所有内容都是“ AND区域:“芝加哥地区””,它只能在将区域设置为Chicago区域的情况下抓取工作。因此,在我的Vue应用程序中,我有一个下拉输入,其中填充了用户可以过滤的所有区域。选择一个后,我要获取该数据并使用Axios对其进行发布,并更新PHP查询以向其添加过滤器。

我一直在圈子里奔波,试图使它起作用,并碰到我所缺少的东西。我相信我只是想做一个像Ajax这样的功能,而是改用Axios post。

1 个答案:

答案 0 :(得分:0)

似乎您只是没有将该变量连接到字符串中。您需要做的只是在传递给函数的字符串中使用该变量,如下所示:

<?php 
echo getBhQuery('search','JobOrder','isOpen:true AND region:"'. $region .'"','id,title,categories,dateAdded,externalCategoryID,employmentType,customText12'); ?>