How can I merge 2 search forms together? - php

Question

I am doing my website on Wordpress.
I have 2 search forms that appear separate on my website and I was wondering how could I merge them into one.
The first search form searches for products First search form
The second one searches for the location of the products Second search form
Sorry for asking this silly question and thank you for your help :D

Answer 1

Javascript is what you need to start learning. It is the essential other half of webpage design. With Javascript you can get the value from anything on the page. Here's the basic code for pulling the values from the inputs of two different forms and posting them to your PHP file.
<!--first form-->
<form>
<input type="text" id="product" name="product">
</form>
<!--second form-->
<form>
<input type="text" id="city" name="city">
</form>
<button onclick="continuePost()">Submit Both</button>
<div id="result"></div>
<script>
function continuePost() {
var product = encodeURIComponent(document.getElementById("product").value);
var city = encodeURIComponent(document.getElementById("city").value);
var params = "product="+product+"&city="+city;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var myResponse = JSON.parse(this.responseText); //send a JSON response back from your PHP file
if(myResponse.hasOwnProperty('error')){
document.getElementById("result").innerHTML = myResponse.error;
}else{
var result1 = myResponse.myResult1;
var result2 = myResponse.myResult2[0]; //or whatever key and value pairs that you used in the JSON response that you sent back from you PHP file
document.getElementById("result").innerHTML = result1;
}
}else{
window.setTimeout(failed(), 3000);
}
};
xhttp.open("POST", "yourPHPfile.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send(params);
}
function failed(){
document.getElementById("result").innerHTML = 'Failed to connect to server.';
}
</script>
yourPHPfile.php
<?php
$obj = new stdClass();
$obj->dateread = date("D M j G:i:s T Y");
if(!isset($_POST["product"])){
$obj->error = 'No product.';
echo json_encode($obj);
exit;
}else {
$product=$_POST["product"];
}
if(!isset($_POST["city"])){
$obj->error = 'No city.';
echo json_encode($obj);
exit;
}else {
$city=$_POST["city"];
}
$obj->myResult1 = 'Info you want back from your PHP file.';
$obj->myResult2 = ['array', 'of', 'info', 'you', 'want'];
echo json_encode($obj);
?>