Я тестирую простой код в asp.net с картами и маркерами Google, я хочу обновить маркеры в зависимости от выбранной кнопки.Я пытаюсь привязать значение (датируемое) из хранимой процедуры к шаблону элемента повторителя и выполнить частичное обновление на карте, оно работает при первой загрузке страницы (связывание), но при новом значении (при нажатии кнопки).) вообще не связывается.
UpdatePanel
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" >
<ContentTemplate>
<p>
<asp:Button ID="Button1" runat="server" class="btn btn-outline btn-link" AutoPostback=true Text="1" onClick=" Button1" />
|
<asp:Button ID="Button2" runat="server" Text="2" class="btn btn-outline btn-link" AutoPostback=true OnClick =" Button_2" />
|
<asp:Button ID="Button3" runat="server" class="btn btn-outline btn-link" Text="3" AutoPostback=true onClick=" Button3" />
</p>
</ContentTemplate>
</asp:UpdatePanel>
Шаблон
<script type ="text/javascript">
var markers = [
<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
{
"title": '<%# Eval("Title") %>',
"lat": '<%# Eval("Latitude") %>',
"lng": '<%# Eval("Longitude") %>',
}
</ItemTemplate>
<SeparatorTemplate>
,
</SeparatorTemplate>
</asp:Repeater>
];
Карта
window.onload = function () {
LoadMap();
};
var myLatlng;
var markerCluster;
//On UpdatePanel Refresh
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
prm.add_endRequest(function (sender, e) {
if (sender._postBackSettings.panelsToUpdate != null) {
CreateMarkers();
alert("markers"+JSON.stringify(markers, null, 4));
}
});
};
var latlng = new google.maps.LatLng(-25.45, -49.25);;
var opcoes = {
zoom: 4,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
function LoadMap() {
mapa = new google.maps.Map(document.getElementById("mapa"), opcoes);
CreateMarkers();
}
function CreateMarkers() {
var googleMarkers = [];
var infoWindow = new google.maps.InfoWindow();
markersaux = markers;
for (i = 0; i < markersaux.length; i++) {
var data = markersaux[i]
if (data.lat == null || data.lat == "" || data.lat == "undefined" || data.lat == "null") {
myLatlng = new google.maps.LatLng(-25.438 , -49.2787);
} else {
var latitude = data.lat.replace(",", ".");
var longitude = data.lng.replace(",", ".");
myLatlng = new google.maps.LatLng(latitude, longitude);
}
var marker = new google.maps.Marker({
position: myLatlng,
map: mapa,
animation: google.maps.Animation.DROP,
title: data.title
});
googleMarkers.push(marker);
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent("Title: " + data.title +"<br /> Latitude: " + data.lat + "<br />Longitude: " + data.lng);
infoWindow.open(mapa, marker);
});
})(marker, data);
}
Код позади
protected void Page_Load(object sender, EventArgs e)
{
...
DataTable dt = this.GetData(sql);
rptMarkers.DataSource = dt;
rptMarkers.DataBind();//It's binding here
if (!this.IsPostBack)
{
}
}
protected void Button1(object sender, EventArgs e)
{
DataTable dt = this.GetData(sql2);
this.rptMarkers.DataSource = dt;
this.rptMarkers.DataBind();//Value of dt here is correct, but it's not binding
this.UpdatePanel1.Update();
}