Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New Coder
    Join Date
    Jan 2003
    Posts
    49
    Thanks
    0
    Thanked 0 Times in 0 Posts

    window.location.href fails in Firefox

    I am trying to make a search facility where a user makes a selection from two list boxes and then a button takes the user to the appropriate HTML page.

    It works fine in IE 6, but when I try the same in Firefox, it just stays on the search page. Can anyone see what I am doing wrong?

    The function in the head code is:

    function testbutton()
    {
    var searchForm = document.search;
    var linkAddress;

    if (searchForm.region.value == "ALL" && searchForm.specialism.value == "ALL" )
    {
    linkAddress = "results/all-all.html";
    }
    else if (searchForm.region.value == "ALL" && searchForm.specialism.value != "ALL" )
    {
    linkAddress = "results/" + searchForm.specialism.value + ".html";
    }
    else if (searchForm.region.value != "ALL" && searchForm.specialism.value == "ALL" )
    {
    linkAddress = "results/" + searchForm.region.value + ".html";
    }
    else
    {
    linkAddress = "results/" + searchForm.specialism.value + "-" + searchForm.region.value + ".html";
    }
    alert("user selected " + linkAddress);
    window.location.href = linkAddress;
    }

    The HTML calling the function is:

    <form name="search">
    <select name="region">
    <option value="ALL">ALL</option>
    <option id="scotland" value="scotland">Scotland</option>
    <option id="england" value="england">England</option>
    </select>
    AND / OR
    <select name="specialism">
    <option value="ALL">ALL</option>
    <option id="office" value="office">Office</option>
    <option id="leisure" value="leisure">Leisure</option>
    </select>
    <button onclick="testbutton();">Find!</button>
    </form>

    Note the "alert" works fine on both browsers, its just that Firefox stays put and goes nowehere whereas IE goes to the right page.


  • #2
    New Coder
    Join Date
    Aug 2004
    Posts
    68
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Use document.location.href and try it.

    Afru.

  • #3
    New Coder
    Join Date
    Jan 2003
    Posts
    49
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks Afru. tried document instead of window but it still doesn't work in Firefox


  • #4
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    I would make your link address the entire url and not a relative one.

    Also is Firefox returning an error message. Look at the JavaScript Console under the tools menu.

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #5
    Senior Coder
    Join Date
    Apr 2005
    Posts
    1,051
    Thanks
    0
    Thanked 0 Times in 0 Posts
    try:

    var ReferURL = window.location.href;
    window.location.href = ReferURL + linkAddress;

    I don't know if that was your problem or not. My FF doesn't return any errors.

  • #6
    New Coder
    Join Date
    Jan 2003
    Posts
    49
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I tried both these suggestions but sadly they still don't work.

    Firefox doesn't actually return an error. What happens is when the "submit" button is clicked instead of going to the new page, the current page refreshes and the address bar in the browser reads:

    "current url" with ?region=ALL&specialism=ALL added

    (or whatever selection I make)

    Its as if it is performing a GET action on itself rather than following the JavaScript.

    I could resort to PHP which I am more familiar with, but it would be nice to understand why this isn't working.

    Last edited by sametch; 04-08-2005 at 06:44 AM.

  • #7
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    	<head>
    		<title>56428</title>
    	</head>
    	<body>
    		<form name="search" action="56428" method="get" onsubmit="redirect();return false;">
    			<fieldset>
    				<legend>Search</legend>
    
    				<div>
    					<label for="region">Region</label>
    					<select id="region" name="region">
    						<option value="all">ALL</option>
    						<option id="scotland" value="scotland">Scotland</option>
    						<option id="england" value="england">England</option>
    					</select>
    				</div>
    
    				<p>
    					AND / OR
    				</p>
    
    				<div>
    					<label for="specialism">Specialism</label>
    					<select id="specialism" name="specialism">
    						<option value="all">ALL</option>
    						<option id="office" value="office">Office</option>
    						<option id="leisure" value="leisure">Leisure</option>
    					</select>
    				</div>
    
    				<input type="submit" value="Find">
    			</fieldset>
    		</form>
    
    		<script type="text/javascript">
    			function redirect()
    			{
    				var region = document.getElementById('region').value;
    				var specialism = document.getElementById('specialism').value;
    
    				var url = 'results/';
    
    				if(region == 'all')
    				{
    					if(specialism == 'all')
    					{
    						url += 'all-all.html';
    					}
    					else
    					{
    						url += specialism + '.html';
    					}
    				}
    				else
    				{
    					if(specialism == 'all')
    					{
    						url += region + '.html';
    					}
    					else
    					{
    						url += region + '-' + specialism + '.html';
    					}
    				}
    
    				alert("user selected " + url);
    				document.location.href = url;
    			}
    		</script>
    	</body>
    </html>
    Make sure you have PHP to catch users with Javascript disabled. BTW, can anyone see a better way of handling the if/else block?
    Forget style. Code to semantics. Seperate style from structure, and structure from behaviour.
    I code to specs, and test only in Firefox (unless stated otherwise).

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    As I tested it in Firefox, I found out that <button>'s default behavior is a submit button (unlike in IE). So you have to do a return false to cancel form submission. If you're running the page locally, you need to make it an absolute path and not a relative path. But if you run it online, relative path is fine.

    <button onclick="testbutton(); return false;">Find!</button>

    or:

    <button onclick="return testbutton();">Find!</button>

    and then put return false at the end of the function.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #9
    New Coder
    Join Date
    Jan 2003
    Posts
    49
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Glenn

    Your a life saver, that works fine,



    thanks!

  • #10
    New to the CF scene
    Join Date
    Feb 2008
    Location
    Singapore
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi all,

    There is an easier way that works for me.
    <button onClick="testbutton();" type="button">Order</button>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •