?
Solved

Firefox and IE URL difference

Posted on 2008-10-28
17
Medium Priority
?
349 Views
Last Modified: 2013-12-08
Hi experts!

When I perform the same keword search on IE7 and Firefox I get two different URLS for the search results page:

Firefox
http://www.mytestsite.com/search_result.php?search=john+smith&submit.x=0&submit.y=0&submit=submit

IE
http://www.mytestsite.com/search_result.php?search=john&smith

Can someone tell me what this extra bit of text Firefox adds to the URL is and how do I get rid of it to make it look more intelligible? thanks
0
Comment
Question by:allanch08
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 4
  • 3
  • +1
17 Comments
 
LVL 42

Expert Comment

by:David S.
ID: 22827340
It seems that you're using an <input type="image"> element. One solution might be to remove its name attribute.
0
 
LVL 3

Expert Comment

by:Pedro Chagas
ID: 22827362
Please, show to us the code that contain the forms you use to send the information.
0
 

Author Comment

by:allanch08
ID: 22828938
Hello, yes, i'm using an image instead of the usual submit button. I'll try removing the name attribute later on. Any reason why Firefox and IE shoe different URL's? surely if its the web they should show the same URL regardless of browser
0
On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

 
LVL 19

Assisted Solution

by:v2Media
v2Media earned 600 total points
ID: 22829127
Firefox and IE behave differently in how form submit input vars are sent. IE by default, does not pass the value of the submit button if the user presses enter and there's a single text input in the form. This bizarre behaviour is solved by inserting another text input and hiding it using css.

Firefox will submit all input values regardless of whether the user presses enter or clicks submit.

I may be wrong with particular details here, but this is the general idea of the url differences you're noticing.
0
 

Author Comment

by:allanch08
ID: 22829252
thanks that sounds like a logical answer
0
 
LVL 19

Assisted Solution

by:v2Media
v2Media earned 600 total points
ID: 22829382
The standard work-around that I use for all of IE's buggy form input behaviours is to use css styling of a standard input button with an image as the background. The solution below uses valid html/css: -
<style type="text/css>
#frm_submit {
  width: 40px;
  height: 18px;
  background: url(images/frm_submit.jpg);
  border: none;
  padding: 0;
  margin: 0;
}
</style>
 
<input type="submit" id="frm_submit" value="" />

Open in new window

0
 

Author Comment

by:allanch08
ID: 22829606
so does this make my url more comprehensible looking as I prefer it without the submit button values?
0
 
LVL 19

Assisted Solution

by:v2Media
v2Media earned 600 total points
ID: 22829768
Firefox and IE will behave with a standard input yes. As soon as you use an image for a submit, wierd stuff happens. If you dont want the submit name/value pair in the url at all, dont use a submit input of any kind.

Yet another option, use POST instead of get, the url wont have a querystring at all.
0
 

Author Comment

by:allanch08
ID: 22829864
thanks. at the moment I'm using GET so that the URL can be bookmarked.  I'm also using php to process the form and the line of code I'm using to check if form is submitted is shown below. I'll have to cehck if this is affected.
if (isset($_POST['submit'])) {
 
xxx
 
}

Open in new window

0
 
LVL 19

Assisted Solution

by:v2Media
v2Media earned 600 total points
ID: 22830402
You can use any field from the form to check if it's been submitted. "search" would be the logical choice. However if your form is using the get method, checking the post array isn't a good idea.

If you check for $_GET['search'] to begin form processing, you'll want to validate more than if it's merely set i.e. if(!empty($_GET['search'])). This way, form processing only begins if search is set AND it's not an empty value.
0
 

Author Comment

by:allanch08
ID: 22830755
thanks, having an emtpy field is something I overlooked. I'll add that to it and see how it works.
0
 
LVL 42

Accepted Solution

by:
David S. earned 600 total points
ID: 22834550
> The standard work-around that I use for all of IE's buggy form input behaviours is to use css styling of a
> standard input button with an image as the background.

I disagree. What happens if someone can't see the image?  It would be better to do something like this:

<button type="submit"><img src="submit.jpg" alt="Submit"></button>


> Any reason why Firefox and IE shoe different URL's? surely if its the web they should show the same URL regardless of browser

The URL is only a side effect of the issue.  There once was a technology called server-side image maps. It used a form and the <input type="image"> element. When a user clicked on the image, the coordinates were sent to the server which then did some appropriate action. Some browsers still send the coordinates.  Now it's best to avoid using both kinds of image maps due to accessibility issues. There are certain CSS techniques that provide a much more user-friendly equivalent.
0
 

Author Comment

by:allanch08
ID: 22834974
currently I'm just usingthe code below, it works and looks nicer then the generic submit button. the only annoying thing is the x=0&submit.y=0&submit=submit which do look like co-ordinates of some sorts
<input type="image" src="/images/button.gif" name="submit" alt="submit"/>

Open in new window

0
 

Author Comment

by:allanch08
ID: 22835619
"The URL is only a side effect of the issue.  There once was a technology called server-side image maps. It used a form and the <input type="image"> element. When a user clicked on the image, the coordinates were sent to the server which then did some appropriate action. Some browsers still send the coordinates.  Now it's best to avoid using both kinds of image maps due to accessibility issues. There are certain CSS techniques that provide a much more user-friendly equivalent."

So when it comes to this issue is Firefox more standards compliant by displaying this additional information?
0
 
LVL 42

Assisted Solution

by:David S.
David S. earned 600 total points
ID: 22835708
> So when it comes to this issue is Firefox more standards compliant by displaying this additional information?

Yes. Here's the relevant section of the HTML 4.01 Specs, if you're interested: http://www.w3.org/TR/html401/interact/forms.html#h-17.4.1
0
 

Author Comment

by:allanch08
ID: 22835837
thanks. will read up on that.
0
 

Author Comment

by:allanch08
ID: 22835984
I've updated the code to make sure the textfield is not empty. It also occurred to me do I really need to check if the form has been submitted as surely if it hasn't then no search would go through?
//Check if textfield is not empty.
if (!empty($_GET['textfield'])) {
	$textfield = ($_GET['textfield']);
	}
else {
	$textfield = NULL;
	echo 'You forgot to enter a keyword for your search.';
}
// Only allow letters in textfield.
if (preg_match("^/[A-Za-z]+/", $_GET['textfield'])) { 
	$textfield = $_GET['textfield'];
}

Open in new window

0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I recently found myself in a Corporate Situation where the client had requested blocking access to any and all websites except his own Domain? Easy? I am sure this would be your answer but their requirement was, this has to be done without using…
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…
Suggested Courses

801 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question