ScriptManager不更新

Question

傍晚時分，我試圖創建一個頁面，它將從數據庫中提取位置並將其顯示在gridview中，然後這個gridview會指示出現在Google maps元素上的某些點。它在啓動時工作正常，但是當我使用文本框來優化gridview中的項目時，地圖消失。我猜這是ScriptManager的問題，但我不確定究竟是什麼原因。任何想法將不勝感激。代碼牆的道歉我只是有點不確定在這個階段可能相關的東西。

<%@ 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

updatepanel更新會導致您遇到的問題。如果在更新面板中，您需要在回發時重新初始化Google地圖...要做到這一點，您可以附加到Sys.Application的endRequest事件，該事件在updatepanel結束時觸發，並重新初始化地圖。或者將地圖從更新面板中取出。