将 MSSQL 表值传递给 javascript答案

【问题标题】：Pass MSSQL table values to javascript将 MSSQL 表值传递给 javascript
【发布时间】：2015-05-15 14:44:27
【问题描述】：

我正在尝试使用 asp.net mvc 4 和 EF6 创建一个网站，我想将值从 MSSQL 表传递到 javascript。到目前为止，一切正常，除非我为 google-map-api 函数传递 Latitude 和 Longitude 值，地图不会出现在我的视图中。我使用Html.HiddenFor 助手从<span> 传递值。这是我的代码，

控制器

public ActionResult BranchDetails(int BrId)
    {
        Branch branchDetails = abdb.Branches.Find(BrId);
        return View(branchDetails);
    }

查看

<script>
    function initialize() {
        var marker;
        var LatTag = document.getElementById("Lat");
        var Lat = LatTag.getElementsByTagName("span");
        var LngTag = document.getElementById("Lng");
        var Lng = LngTag.getElementsByTagName("span");
        var mapProp = {
            center: new google.maps.LatLng(LatTag, LngTag),
            zoom: 18,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);

        marker = new google.maps.Marker({
            position: new google.maps.LatLng(Lat, Lng),
            animation: google.maps.Animation.BOUNCE
        });

        marker.setMap(map);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

<body>
    <div class="container well" style="min-width: 100%; padding-right: 5px;">        
        <div id="googleMap"></div>
        <span id="Lat">@Html.HiddenFor(model => model.Latitude)</span>
        <span id="Lng">@Html.HiddenFor(model => model.Longitude)</span>
        <h4><b>@Html.DisplayFor(model => model.Title)</b></h4>
        <p><strong>Address:</strong> @Html.DisplayFor(model => model.Address)</p>
        <p><strong>Contact No. :</strong> @Html.DisplayFor(model => model.ContactNo)</p>
        <p><strong>Contact Person(s):</strong> @Html.DisplayFor(model => model.ContactPerson)</p>
    </div>
</body>

需要注意的是，我在MSSQL中的Longitude&Latitude字段是在varchar模式下设置的。我不确定它是否会导致问题，但只是觉得需要告知。我怎么解决这个问题？非常需要这个帮助。 Tnx。

【问题讨论】：

标签： javascript sql-server asp.net-mvc google-maps google-maps-api-3

【解决方案1】：

没关系，找到我自己的解决方案。这对我有用，我没有给出 span id，而是给了Html.HiddenFor helper id。由于某种原因，我猜javascript没有选择跨度的ID。这是我的代码，

<script>
    function initialize() {
        var marker;
        var Lat = parseFloat(document.getElementById("Lat").value);
        var Lng = parseFloat(document.getElementById("Lng").value);
        var mapProp = {
            center: new google.maps.LatLng(Lat, Lng),
            zoom: 18,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);

        marker = new google.maps.Marker({
            position: new google.maps.LatLng(Lat, Lng),
            animation: google.maps.Animation.BOUNCE
        });

        marker.setMap(map);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
<body>
    <div id="googleMap"></div>
    @Html.HiddenFor(model => model.Latitude, new { id = "Lat" })
    @Html.HiddenFor(model => model.Longitude, new { id = "Lng" })
</body>

【讨论】：