0
我在ASP.NET MVC 2實施MS NerdDinner應用程序，我使用谷歌地圖，而不是MS地圖。我使用谷歌網站的地圖樣本代碼。我在同一個目錄下有兩個非常簡單的視圖，Create.aspx和Edit.aspx，它們分別創建和編輯晚餐。它們非常簡單 - 它們都呈現一個名爲Dinner.ascx的局部視圖，該視圖也位於同一個目錄中。在ASP.NET MVC2的意見和部分形式的奇怪行爲
Dinner表單包含3個js文件，並且還呈現另一個顯示google地圖的部分表單。我有2個問題：
從編輯視圖中呈現時沒有找到的JavaScript文件，並完全翻倒，而當它從創建視圖稱爲是看到JavaScript文件和工作晚餐形式在一定程度上。創建的網址爲http://localhost/NerdDinner/Dinners/Create，編輯爲http://localhost/NerdDinner/Dinners/Edit/39。爲什麼從編輯視圖中找不到JS文件，即使兩個視圖都呈現相同的局部視圖？
在Firefox（版本3.6.8）中，「創建」頁面有時會起作用，它非常不一致。通常在刷新幾次或離開並返回頁面後，它最終會工作，而在IE 8中它始終工作。爲什麼FF不一致？
將溶液的目錄結構是：
的NerdDinner（根）
控制器
- HomeController.cs
- DinnersController.cs
- 等
模型
腳本
- CurrentJS .js
- MainJS.js
- jQuery的1.4.1.js
- 等
查看
- 帳戶
- 晚餐
- - Create.aspx
- - Edit.aspx
- - DinnerForm.ascx
- - GoogleMap2.ascx
- - 等
- 首頁
- 共享
我一直b用這種方法將我的頭靠在牆上玩了兩天，再也看不到樹木了。下面的代碼（道歉，如果這是一個有點冗長）：
Create.aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<NerdDinner.Controllers.DinnerFormViewModel>" %>
<asp:Content ID="Title" ContentPlaceHolderID="TitleContent" runat="server">
Host a Dinner
</asp:Content>
<asp:Content ID="Create" ContentPlaceHolderID="MainContent" runat="server">
<h2>Host a Dinner</h2>
<% Html.RenderPartial("DinnerForm"); %>
</asp:Content>
Edit.aspx：
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<NerdDinner.Controllers.DinnerFormViewModel>" %>
<asp:Content ID="Title" ContentPlaceHolderID="TitleContent" runat="server">
Edit:
<%=Html.Encode(Model.Dinner.Title) %>
</asp:Content>
<asp:Content ID="Edit" ContentPlaceHolderID="MainContent" runat="server">
<h2>
Edit Dinner</h2>
<% Html.RenderPartial("DinnerForm"); %>
</asp:Content>
DinnerForm.ascx：
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<NerdDinner.Controllers.DinnerFormViewModel>" %>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="../Scripts/MainJS.js"></script>
<script type="text/javascript" src="../Scripts/CurrentJS.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#Address").blur(function(evt) {
$("#Latitude").val("");
$("#Longitude").val("");
var address = jQuery.trim($("#Address").val());
alert('address: ' + address);
if (address.length < 1)
return;
codeAddress();
});
});
</script>
<%= Html.ValidationSummary("Please correct your errors and try again.") %>
<% using (Html.BeginForm()) { %>
<fieldset>
<p>
<label for="Title">
Dinner Title:</label>
<%= Html.TextBox("Title", Model.Dinner.Title) %>
<%=Html.ValidationMessage("Title", "*") %>
</p>
<p>
<label for="EventDate">
Event Date:</label>
<%= Html.TextBox("EventDate", Model.Dinner.EventDate) %>
<%= Html.ValidationMessage("EventDate", "*") %>
</p>
<p>
<label for="Description">
Description:</label>
<%= Html.TextArea("Description", Model.Dinner.Description) %>
<%= Html.ValidationMessage("Description", "*") %>
</p>
<p>
<label for="Address">
Address:</label>
<%= Html.TextBox("Address", Model.Dinner.Address) %>
<%= Html.ValidationMessage("Address", "*") %>
</p>
<p>
<label for="Country">
Country:</label>
<%= Html.DropDownList("Country", Model.Countries) %>
<%= Html.ValidationMessage("Country", "*") %>
</p>
<p>
<label for="ContactPhone">
Contact Phone #:</label>
<%= Html.TextBox("ContactPhone", Model.Dinner.ContactPhone) %>
<%= Html.ValidationMessage("ContactPhone", "*") %>
</p>
<p>
<%= Html.Hidden("Latitude", Model.Dinner.Latitude) %>
</p>
<p>
<%= Html.Hidden("Longitude", Model.Dinner.Longitude) %>
</p>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
<div id="mapDiv">
<%Html.RenderPartial("GoogleMap2", Model.Dinner); %>
</div>
<% } %>
GoogleMap2。ASCX：
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 50% }
#infoPanel {
float: left;
margin-left: 10px;
}
#infoPanel div {
margin-bottom: 5px;
}
</style>
<!-- End add for google map -->
<div id="map_canvas" style="width: 765px; height: 400px;">
</div>
<div id="infoPanel">
<b>Marker status:</b>
<div id="markerStatus">
<i>Click and drag the marker.</i></div>
<b>Current position:</b>
<div id="info"></div>
<b>Closest matching address:</b>
<div id="address"></div>
</div>
<script type="text/javascript">
$(document).ready(function() {
initialize4();
});
</script>
CurrentJS.js：
//// +++++++++++ Start of attempt to pinpoint location automatically
function initialize4() {
var myOptions = {
zoom: 9,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// Try W3C Geolocation (Preferred)
if (navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
map.setCenter(initialLocation);
}, function() {
handleNoGeolocation(browserSupportFlag);
});
// Browser doesn't support Geolocation
} else {
browserSupportFlag = false;
handleNoGeolocation(browserSupportFlag);
}
if (initialLocation == 'undefined')
alert('1' + initialLocation);
else
alert('2' + initialLocation);
//Add draggable marker
var marker = new google.maps.Marker({
position: initialLocation, //latLng,
title: 'Point B',
map: map,
draggable: true
});
// Update current position info.
updateMarkerPosition(initialLocation);
geocodePosition(initialLocation);
// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function() {
updateMarkerAddress('Dragging...');
});
google.maps.event.addListener(marker, 'drag', function() {
updateMarkerStatus('Dragging...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function() {
updateMarkerStatus('Drag ended');
geocodePosition(marker.getPosition());
});
function handleNoGeolocation(errorFlag) {
if (errorFlag == true) {
alert("Geolocation service failed.");
initialLocation = newyork;
} else {
alert("Your browser doesn't support geolocation. We've placed you in newyork.");
initialLocation = newyork;
}
map.setCenter(initialLocation);
}
}
function geocodePosition(pos) {
geocoder.geocode({
latLng: pos
}, function(responses) {
if (responses && responses.length > 0) {
updateMarkerAddress(responses[0].formatted_address);
} else {
updateMarkerAddress('Cannot determine address at this location.');
}
});
}
function updateMarkerStatus(str) {
document.getElementById('markerStatus').innerHTML = str;
}
function updateMarkerPosition(latLng) {
//alert('latLng:' + latLng);
document.getElementById('info').innerHTML = [
latLng.lat(),
latLng.lng()
].join(', ');
}
function updateMarkerAddress(str) {
document.getElementById('address').innerHTML = str;
}
function codeAddress() {
var address = document.getElementById("address").value;
alert('In codeAddress');
geocoder.geocode({ 'address': address }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
//// +++++++++++++ End attempt to pinpoint location automatically
喜添 - 爲Q1，你可以重寫你有什麼written..seems是缺少一些文字。對於Q2，Firefox經常不會在網頁上顯示地圖，只是一個空白的div區域。我打電話給navigator.geolocation.getCurrentPosition，應該返回具有經度和緯度位置的數據。任何時候地圖都不顯示，這是不確定的。在IE中它總是返回2個值。 – 2010-09-07 16:22:04