SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Apr 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Baffled by form submit

    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.

    HTML Code:
    <!--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

    HTML Code:
    //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();

    HTML Code:
    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.

    HTML Code:
    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

  2. #2
    SitePoint Addict
    Join Date
    Apr 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Should have said postit() is a function which checks for the validity of the postcode i.e. correct length, format etc etc.

  3. #3
    SitePoint Addict
    Join Date
    Apr 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.


Bookmarks

Posting Permissions

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