Results 1 to 7 of 7

Thread: Pin not dropped when address is searched for and added

  1. #1
    Join Date
    Feb 2016
    Posts
    54
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Default Pin not dropped when address is searched for and added

    I have managed to put together aload of coding to be able to assign a pin, along with time and reference to a searched address, but for some reason when I search the addres it works fine but it fails to drop a pin when assigned. I have attached all my code etc below. I cannot see what is stopping it to work. Any help will be appreciated. many thanks

    Code:
     $('#controls').on('click change', function () {
                // This can take a while to load so only return if defined
                if (typeof ($('#counties').get(0)) != "undefined")
                    $('#counties').get(0).selectedIndex = 0;
            });
    
            $('#overhere').on('change', '#counties', function () {
                var v = this.value;
                if (!v) { return; }
                $('#lastcounty').html('Most Recent: ' + v);
                var bounds = new google.maps.LatLngBounds();
                if (v === 'Isles of Scilly') {
                    bounds.extend(new google.maps.LatLng(49.938074, -6.303835));
                    map.fitBounds(bounds);
                    map.setZoom(11);
                    return;
                }
                var poly = pollies[v].latLngs.j[0].j, i = poly.length;
                while (--i > -1) {
                    bounds.extend(poly[i]);
                }
                map.fitBounds(bounds);
                if (v === 'Bristol, City of') { map.setZoom(10); }
            });
    
            $('#overhere').on('click', '#togglecounties', function () {
                this.disabled = true;
                $('#counties').get(0).selectedIndex = 0;
                var t = this, i = polAr.length, how = ScillyPollies[0].map ? null : map, poly;
                //	if(ScillyPollies[0].infowindow.map){ScillyPollies[0].infowindow.close();}
                while (--i > -1) {
                    poly = polAr[i];
                    !how && poly.infowindow && poly.infowindow.map && poly.infowindow.close();
                    poly.setMap(how);
                }
                setTimeout(function () { t.disabled = false; }, 400);
            });
            <%--
                Creates the marker. Adds a timer on the marker to show how long it is on there for.
                Handles a click event to open up dialog.
                Will change timer to date and time added as this will be easier to do as getting data from table
            --%>
            function createMarker(latlng, html, map, reference) {
                if (markers[html]) { return false; }
                var ref = reference;
                infowindow = new google.maps.InfoWindow({
                    content: ref || html
                }),
                marker = new google.maps.Marker({
                    map: map,
                    time: new Date(),
                    position: latlng,
                    html: html,
                    icon: defaultPin,
                    infowindow: infowindow
                }),
                $tm = $('#themarkers').append('<option value="' + html + '" title="' + infowindow.content + '">' + html + '</option>');
                $tm.get(0).selectedIndex = 0;
                marker.addListener('mouseover', function () {
                    clearInterval(infowindow.timer);
                    infowindow.setContent((ref || html) + '<br>' + elapsed(marker.time));
                    $('#supplementwindow').html(infowindow.content).fadeIn();
                    infowindow.timer = setInterval(function () {
                        infowindow.setContent((ref || html) + '<br>' + elapsed(marker.time));
                        $('#supplementwindow').html(infowindow.content);
                    }, 300);
                    infowindow.open(map, this);
                });
                marker.addListener('mouseout', function () {
                    clearInterval(infowindow.timer);
                    infowindow.close();
                    $('#supplementwindow').fadeOut();
                });
                marker.addListener('click', function () {
                    var oe = this.optel;
                    $tm.get(0).selectedIndex = $('option', $tm).index(oe);
                    $tm.trigger('change');
                });
                marker.optel = $('option', $tm).last();
                $tm.get(0).size = $('option', $tm).length;
                markers[html] = marker;
    
                //We want to return true as we have successfully created a marker.
                return true;
            }
    
    
            $('form').submit(function (e) {
                var address = $('#<%=tbAddress.ClientID%>', this).val();
                var reference = $('#<%=referenceTxt.ClientID%>').val();
                var information = $('#<%=informationTxt.ClientID%>').val();
    
                if (address) {
                    geocoder.geocode({
                        'address': address
                    }, function (results, status) {
                        if (status == google.maps.GeocoderStatus.OK) {
                            map.setCenter(results[0].geometry.location);
    
                            //if (createMarker(results[0].geometry.location, address, map, reference)) {
                            <%--Commented out as it does not go to the new marker.--%>
                            //bounds.extend(results[0].geometry.location);
                            //map.fitBounds(bounds);
                                <%--Zoom level. 21 max zoom level--%>
                            map.setZoom(18);
                            var toLoadOnServer = {
                                Location: results[0].formatted_address,
                                Longitude: results[0].geometry.location.lng(),
                                Latitude: results[0].geometry.location.lat(),
                                NameNumber: results[0].address_components[0].long_name,
                                Street: results[0].address_components[1].long_name,
                                Town: results[0].address_components[2].long_name,
                                //PostCode: (results[0].address_components[7].long_name === undefined) ? '': results[0].address_components[7].long_name,
                                Reference: reference,
                                Information: information,
                            };
    
                            AjaxPostToAddMarker(toLoadOnServer);
                            markers = [];
                            LoadMarkersFromServer();
    
                            //} else {
                            //    alert(address + ' or another marker with the same location already exists! Skipping.');
                            //}
    
                        }
                        else {
                            alert("Geocode was not successful for the following reason: " + status);
                        }
                    });
                }
                e.preventDefault();
            });
    
            function AjaxPostToAddMarker(ToLoadOntoServer) {
                $.ajax({
                    type: "POST",
                    url: "Tasking.aspx/AddDataToServer",
                    data: JSON.stringify({ 'address': ToLoadOntoServer }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        //alert(data.d);
                    },
                    error: function () {
                        alert("Could not create marker in server. Please try again.");
                    }
                })
            }
            //Have to double do this to make sure google api is loaded first. So first one makes sure the page has loaded. Then it will make sure the document is ready.
            window.onload = function () {
                LoadMarkersFromServer();
    
                //Once this div has been created call this function. Stops the elements not being found or == null
                $('#locationDiv').ready(function () {
                    google.maps.event.addDomListener(window, 'load', SetAutoAddressExtender('<%=tbSearchAddress.ClientID%>', '<%=tbAddress.ClientID%>'))
                });
            }
    
            
    
            
            function LoadMarkersFromServer() {
                $(document).ready(function () {
                    $.ajax({
                        type: "POST",
                        url: "Tasking.aspx/GetMarkersFromServer",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (data) {
                            LoadMarkersFromFile(data.d);
                        },
                        failure: function () {
                            alert("Failed");
                        },
                        error: function (xhr, ajaxOptions, thrownError) {
                            alert(xhr.status);
                            alert(xhr.responseText);
                        }
                    });
                });
            }
    
            $('#activatemarker').click(function () {
                //If the job window is not visible we do not want to allow this to work.
                if (!$('#supplementwindow').is(":visible"))
                    return;
    
                var tm = $('#themarkers'), si = tm.get(0).options.selectedIndex, $o = $('option', tm).eq(si), m = $o.val();
                if (!m) { return; }
    
                markers[m].setIcon(pinImage);
    
                var supplementWindow = $('#supplementwindow');
    
                var stringToPass = supplementWindow[0].innerHTML;
    
                if (stringToPass == null)
                    return;
    
                $.ajax({
                    type: "POST",
                    url: "Tasking.aspx/AllocateJob",
                    data: "{ 'markerCaption': '" + stringToPass + "'}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        if (!data.d)
                            alert("This job has already allocated");
                        else {
                            //Clears the array to load again from server
                            markers = [];
                            LoadMarkersFromServer();
                            //Fades out the window
                            $('#supplementwindow').hide();
                        }
                    },
                    error: function () {
                        alert("Could not Allocate and create form. Please try again.");
                    }
                })
            });
    
            $('#removemarker').click(function () {
                var tm = $('#themarkers'), si = tm.get(0).options.selectedIndex, $o = $('option', tm).eq(si), m = $o.val(), n;
                if (!m) { return; }
                markers[m].setMap(null);
                delete markers[m];
                $o.remove();
                tm.get(0).selectedIndex = 0;
                bounds = new google.maps.LatLngBounds();
                if ((n = $('option', tm).length) > 1) {
                    $.each(markers, function (i, v) {
                        bounds.extend(v.position);
                    });
                    map.fitBounds(bounds);
                }
                if (n < 3) {
                    map.setZoom(n > 1 ? 13 : 8);
                }
                tm.get(0).size = n;
            });
            $('#themarkers').change(function () {
                this.title = this.options[this.options.selectedIndex].title;
                var m = this.value;
                if (!m) { return; }
                map.setCenter(markers[m].position);
                map.setZoom(18);
                this.size = $('option', $(this)).length;
            });
            $('#showall').click(function () {
                var $tm = $('#themarkers'), n = $('option', $tm).length - 1;
                $tm.get(0).selectedIndex = 0;
                if (!n) {
                    map.setCenter(new google.maps.LatLng(52.178227, -0.4013));
                    map.setZoom(8);
                    return;
                }
                map.fitBounds(bounds);
                if (n === 1) {
                    map.setZoom(8);
                }
            });
    
        </script>
    Last edited by kwood30; 12-11-2017 at 10:44 AM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,440
    Thanks
    78
    Thanked 3,443 Times in 3,404 Posts
    Blog Entries
    12

    Default

    Could you possibly explain more of what this is about? I don't even know what you mean by a pin. Is that like a number? And does dropping it mean erasing it or what?
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Feb 2016
    Posts
    54
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Thank you for your response.

    What should be happening is:

    You search for a location using the post code mainly, Then once the address is located, a reference and extra information can be added, once all this has been file and submitted a 'pin' will appear on the map at the entered location, displaying the reference, information and also date created and time elapsed from creation of the 'pin'.

    Hopefully this makes more sense.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,440
    Thanks
    78
    Thanked 3,443 Times in 3,404 Posts
    Blog Entries
    12

    Default

    Thanks for that. I get the idea now. I think it would be best if I also had a link to the page or could at least see the HTML involved. You can post a link here, or PM it to me. If you're not live yet, please post the page's HTML code - at least those parts of it that relate to this issue. I might need the code of server side pages (if any - looks like there might be one or more) that relate to this as well.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Feb 2016
    Posts
    54
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Default

    Sorry it has been a while in getting back to you. Just been busy with the festive period coming up.

    I have PM you the rest of the code. Thanks

  6. #6
    Join Date
    Feb 2016
    Posts
    54
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Default

    Has anyone got any ideas on what I am missing? I can't seem to work it out. Thank you

  7. #7
    Join Date
    Feb 2016
    Posts
    54
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1 View Post
    Thanks for that. I get the idea now. I think it would be best if I also had a link to the page or could at least see the HTML involved. You can post a link here, or PM it to me. If you're not live yet, please post the page's HTML code - at least those parts of it that relate to this issue. I might need the code of server side pages (if any - looks like there might be one or more) that relate to this as well.
    Hi,

    I have PM'd you a couple of times with what you have asked for....I am really stuck on this and would honestly appreciate your help.....If you can't please just let me know. Many thanks

Similar Threads

  1. Simple Tree menu, I searched
    By kingvandal in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 06-27-2011, 06:19 PM
  2. Replies: 3
    Last Post: 06-29-2010, 05:02 AM
  3. Highlighting searched keywords
    By junestag in forum PHP
    Replies: 7
    Last Post: 09-29-2008, 12:30 AM
  4. Newbie needs help with dropped content
    By derekjohnston in forum CSS
    Replies: 2
    Last Post: 05-29-2006, 09:47 PM
  5. Switch Menu II - searched & found, still not working!!
    By sirhexx in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-15-2006, 08:36 PM

Tags for this Thread

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
  •