search query doesnt work in firefox but does in other browsers? - php

Question

i have a search query script that works fine in firefox, safari etc but not in chrome.
for whatever reason once the user types in the query and hits submit im noticing the urls are very different.
in chrome i get this which works and is right
http://localhost/ptb1/home.php?query=london&submit.x=0&submit.y=0&submit=Start+Search
but in firefox i get this (notice that stat+search is missing and i dont know why
http://localhost/ptb1/home.php?query=london&submit.x=12&submit.y=10
please can anyone show me why i am getting this problem and how to put it right, thanks.
here's my code:
<form method="get" action="">
<input type="text" id="text" name="query" class="searchbox" placeholder="Search Name/Location" style="width:120px;"/>
<input type="image" src="../PTB1/assets/img/icons/search.png" height="19" width="20" class="searchbutton" name="submit" value="Start Search" />
</form>
<?php
//PHP CODE STARTS HERE
if(isset($_GET['submit'])){
// Change the fields below as per the requirements
$db_host="localhost";
$db_username="root";
$db_password="";
$db_name="";
$db_tb_atr_name="display_name";
//Now we are going to write a script that will do search task
// leave the below fields as it is except while loop, which will display results on screen
mysql_connect("$db_host","$db_username","$db_password");
mysql_select_db("$db_name");
$query=mysql_real_escape_string($_GET['query']);
$query_for_result=mysql_query("SELECT *,MATCH(display_name, location, sex, ethnicity, hobbies, station, age, weight_st, weight_lb, height_ft, height_in, build) AGAINST ('$query' IN BOOLEAN MODE) AS relevance FROM ptb_stats WHERE MATCH(display_name, location, sex, ethnicity, hobbies, station, age, weight_st, weight_lb, height_ft, height_in, build) AGAINST('$query' IN BOOLEAN MODE) ORDER BY relevance DESC LIMIT 5");
echo "<div class=\"search-results\">";
while($data_fetch=mysql_fetch_array($query_for_result))
{
echo "<div class=\"text\"><a href=\"profile.php?id={$data_fetch['user_id']}\" class=\"search\">";
echo "<div class=\"spacing\"><img width=35px height= 30px src=\"data/photos/{$data_fetch['user_id']}/_default.jpg\" class=\"boxgridsearch\"/> ";
echo substr($data_fetch[$db_tb_atr_name], 0,160);
echo "</a></div></div>";
}
echo "<div class=\"morebutton-search\">+ view more results</div>";
mysql_close();
}
?>
<style type="text/css">
.boxgridsearch{
width: 35px;
height: 30px;
margin-top:-3px;
margin-left:0px;
margin-right:10px;
float:left;
background:#161613;
border:4px solid #000 .8;
-moz-box-shadow: 0px 0px 8px #CCC;
-webkit-box-shadow: 0px 0px 0px #CCC;
box-shadow: 0px 3px 10px #030303;
}
.suggestionsBox {
position: relative;
left: 12px;
margin: 10px 0px 5px 0px;
width: 172px;
background-color: #FFF;
border: 1px solid #CCC;
color: #fff;
z-index:99;
}
.searchbutton {
padding-top: 2px;
padding-left:5px;
position:absolute;
z-index:70;
}
.spacing {
padding-top: 12px;
padding-bottom:12px;
border-bottom: solid #CCC 1px;
border-top: solid #CCC 1px;
text-align:left;
margin-left:0px;
margin-top:5px;
width:160px;
}
.text {
text-align:left;
margin-left:20px;
margin-top:0px;
width:200px;
}
.search-results {
width: 200px;
height:218px;
float: left;
margin-bottom: 20px;
margin-left: 0px;
margin-top:10px;
text-align: center;
/* [disabled]margin-left: 30px; */
overflow: hidden;
padding-top: 0px;
padding-bottom: 10px;
}
.searchbox {
margin-left: -25px;
}
.suggestionList {
margin: 0px;
padding: 0px;
}
.suggestionList li {
margin: 0px 0px 3px 0px;
padding: 3px;
cursor: pointer;
}
.suggestionList li:hover {
background-color: #659CD8;
}
a.search {
color: #646464;
text-decoration: none;
}
a.search:visited {
color: #646464;
}
a.search:hover {
color: #646464;
text-decoration: none;
}
a.search:active {
color: #646464;
}
</style>

Answer 1

You can try using $_SERVER['REQUEST_METHOD'] to determine if the page has been submitted, rather than isset($_GET['submit']) so basically instead:
if(isset($_GET['submit'])){
// Change the fields below as per the requirements
$db_host="localhost";
$db_username="root";
you do:
if($_SERVER['REQUEST_METHOD'] == 'GET'){
// Change the fields below as per the requirements
$db_host="localhost";
$db_username="root";

Answer 2

Browsers will interpret how that form gets submitted differently. The behavior you're seeing with Firefox is actually the drafted standard:
http://www.whatwg.org/specs/web-apps/current-work/multipage/
Where we could delve into styling buttons vs using images (submit, vs image input type, vs button) - the easiest fix is to just add a hidden input value to your form:
<form method="get" action="">
<input type="hidden" name="dosearch" value="1">
<input type="text" id="text" name="query" class="searchbox" placeholder="Search Name/Location" style="width:120px;"/>
<input type="image" src="../PTB1/assets/img/icons/search.png" height="19" width="20" class="searchbutton" name="submit" value="Start Search" />
</form>
Then just tweak the condition for processing in your PHP:
if(isset($_GET['dosearch'])){
Quick patch.
You should consider a framework if you're going to do lots of this; you get lots of this kind of logic for free, in very clean and stratified code (MVC).