SitePoint Sponsor |
|
User Tag List
Results 1 to 3 of 3
Thread: Baffled by form submit
-
May 1, 2009, 00:16 #1
- 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>
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); } }
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"); }
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(); }
Thanks
-
May 1, 2009, 00:18 #2
- 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.
-
May 1, 2009, 01:23 #3
- 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