ScriptManager不更新

Question

Evening all I'm trying to create a page that will pull locations from a database and display it within a a gridview, this gridview then dictates some points that appear on a Google maps element. It works fine on start up but when I use the text box to refine the items in gridview the map disappears. I'm guessing it's an issue with my ScriptManager but I'm unsure exactly what the cause is. Any ideas would be greatly appreciated. Apologies for the wall of code I'm just a bit unsure what might be relevant at this stage.

    <%@ Page Title="" Language="C#" MasterPageFile="~/Master.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MapTest.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script type="text/javascript">
        function RefreshUpdatePanel() {
            __doPostBack('<%= txtSearch.ClientID %>', '');
        };
    </script>
    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyA5U97yznzCvzDaUZjT3AydlQqyFBQVYc8&sensor=false">
    </script>
    <link href="App_Themes/Default/default.css" rel="stylesheet" type="text/css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="Wrapper">
            <asp:ScriptManager ID="MasterScriptManger" runat="server"></asp:ScriptManager>

            <asp:UpdatePanel ID="upanSearch" runat="server" UpdateMode="Conditional" OnPreRender="upanSearch_PreRender">
                <ContentTemplate>
                    <div class="DataTable">
                        <span>Search</span>
                        <asp:TextBox ID="txtSearch" runat="server" onkeyup="RefreshUpdatePanel();"  onfocus="this.value = this.value;" OnTextChanged="txtSearch_TextChanged" AutoPostBack="True" AutoCompleteType="Disabled"></asp:TextBox>

                        <asp:GridView ID="grdLocations" runat="server" AutoGenerateColumns="False" DataSourceID="sqldsLocations">
                            <AlternatingRowStyle BackColor="#F6F6F6" />
                            <Columns>
                                <asp:BoundField DataField="Location Name" HeaderText="Location Name" SortExpression="Location Name" />
                                <asp:BoundField DataField="Latitude" HeaderText="Latitude" SortExpression="Latitude" />
                                <asp:BoundField DataField="Longitude" HeaderText="Longitude" SortExpression="Longitude" />
                            </Columns> 
                        </asp:GridView>

                        <asp:SqlDataSource ID="sqldsLocations" runat="server" ConnectionString="<%$ ConnectionStrings:MapTestGuestConn %>" SelectCommand="GetLocations(mySearch)" CancelSelectOnNullParameter="False" SelectCommandType="StoredProcedure">
                            <SelectParameters>
                                <asp:ControlParameter ControlID="txtSearch" Name="mySearch" PropertyName="Text" Type="String" />
                            </SelectParameters>
                        </asp:SqlDataSource> 
                    </div>

                    <div id="googleMap" style="width:500px;height:380px;"></div>

                    <script type="text/javascript">
                        initializeMap();
                    </script>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="txtSearch" EventName="TextChanged"/>
                </Triggers>
            </asp:UpdatePanel>         
        </div>   
</asp:Content>

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Windows;

namespace MapTest
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_PreInit(object sender, EventArgs e)
        {
            Page.Theme = "Default";
        }

        protected void upanSearch_PreRender(object sender, EventArgs e)
        {
            //MessageBox.Show(BuildMapScript());
            ScriptManager.RegisterClientScriptBlock(upanSearch, upanSearch.GetType(), "BuildMap", BuildMapScript(), false);
            //ScriptManager.RegisterStartupScript(upanSearch, upanSearch.GetType(), "BuildMap", BuildMapScript(), false);
        }

        protected void txtSearch_TextChanged(object sender, EventArgs e)
        {
            txtSearch.Focus();
        }

        protected string BuildMapScript()
        {
            grdLocations.DataBind();
            string markers = GetMarkers();
            string myScript = @"
                <script type='text/javascript'>
                function initializeMap() {

                var mapOptions = {
                center: new google.maps.LatLng(50.826108, -1.075011),
                zoom: 15,
                mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                var myMap = new google.maps.Map(document.getElementById('googleMap'),
                mapOptions);"
                + markers +
                @"}
                </script>";
            return myScript;
        }

        protected string GetMarkers()
        {
            string markers = "";
            int c = 1;
            foreach (GridViewRow grdRow in grdLocations.Rows)
            {
                markers +=
                    @"var marker" + c + @" = new google.maps.Marker({
                    position: new google.maps.LatLng(" + grdRow.Cells[1].Text.ToString() + ", " +
                    grdRow.Cells[2].Text.ToString() + ")," +
                    @"map: myMap,
                    title:'" + grdRow.Cells[0].Text.ToString() + "'});";
                c++;
            }

            return markers;
        }
    }
}

Answer 1

The updatepanel updating would cause the issue you experience. You would need to reinitialize the google map on postback if within the updatepanel... to do that you can attach to Sys.Application's endRequest event, which fires when the updatepanel finishes, and reinitialize the map. Or pull the map out of the updatepanel.