Baffled by form submit

[mattih5]

Hi,

I'm baffled and can't understand why Chrome and IE don't refresh the page (which is what I want) and Firefox does submit the form. I need the application to not refresh the page on submit. Let me show you the code I have.

Form

Takes a postcode, passes it to getPostcode() for validation, if successful, moves onto Geocode it with Google Maps.

<!--Start Address-->
	<div id="start" class="inputContainer"> 
		<div>
			<div id="errorPostcode">A valid postcode must be entered.</div>
			<form onsubmit="getPostcode(); return false" action="#"> 
				<label class="error" for="search" id="search_error">(A start address/postcode must be entered.)</label><br/>
				<label for="search">Postcode: </label>			
				<input id="search" size="60" type="text" value="" /> 
		        <input type="submit" value="Find Start Address"/><br/>
		        <label for="noPostcode">No Postcode?</label>
		        <input type="checkbox" id="noPostcode" /> 
		    </form> 
		</div>
	</div> 

Function which processes the value from the form

//Handle postcode string input/validation
    	function getPostcode(){
    		var errors=false;
    		var postcode=$("#search").val();    		
    		if(postcode==""||!postit(postcode)){
    			$("#errorPostcode").show();
    			errors=true;
    		}
    		if(!errors){
    			$("#errorPostcode").css("display","none");
    			usePointFromPostcode(postcode,doStart);
    		}
    	}

usePointFromPostcode() function

Function takes `postcode` along with a callback function. Gets point for Google Maps and runs the callback function, in this particular instance the callback function is called doStart();

function usePointFromPostcode(postcode,callbackFunction) {
			//Hide errors
      		$("#systemError").hide();
			localSearch.setSearchCompleteCallback(null,function() {
				if(localSearch.results[0]) {    
					var resultLat=localSearch.results[0].lat;
					var resultLng=localSearch.results[0].lng;
					var point=new GLatLng(resultLat,resultLng);
					callbackFunction(point);
				} else {
					$("#systemError").html('<p>Could not find "'+postcode+ '"</p>');
					$("#systemError").show();
				}
			});  
			localSearch.execute(postcode + ", UK");
		}

doStart() function

Takes the postcode and plots the point on the map, also adds four intermediary markers for `via` routes.

function doStart(point) {
      	//Plot the start point
        createMarker(point,0,icon1);
        path[0]=point;        
        //Plot the intermediary points
        for (var i=1; i<4; i++) {        	
          var lat=(path[0].lat()*(4-i) + path[4].lat()*i)/4;
          var lng=(path[0].lng()*(4-i) + path[4].lng()*i)/4;
          var p=new GLatLng(lat,lng);          
          createMarker(p,i,icon4);
          path[i]=p;
        }       
        bounds.extend(path[0]);
       	bounds.extend(path[4]);
        map.setZoom(map.getBoundsZoomLevel(bounds));
       	map.setCenter(bounds.getCenter());             
		state=1;
        handleState();        
      }

I don't think most of the stuff I have put in will be required but I've included them to give you an idea what is happening. The application works perfect in IE and Chrome but Firefox seems to submit the form, which isn;t what I need.

Thanks

[mattih5]

Should have said postit() is a function which checks for the validity of the postcode i.e. correct length, format etc etc.

[mattih5]

Think I've found the solution.

I was calling usePointFromPostcode() prior to the function being rendered. I used FireBug to look for the problem and usePointFromPostcode() was undefined. This seemed to have a knock on affect and stop everything working.

Strange that all other browsers work in this situation.