将MSSQL表值传递给javascript

时间:2015-03-13 07:20:47

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

我正在尝试使用asp.net mvc 4&amp; EF6我希望将值从MSSQL表传递给javascript。到目前为止一切正常,除非我通过Latitude&amp; Longitude函数的google-map-api值,地图未显示在我的视图中。我使用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>

需要指出的是我的Longitude&amp; MSSQL中的Latitude字段设置为varchar模式。我不确定它是否引起了问题但只是觉得需要通知。我怎么解决这个问题?非常需要这个帮助。 TNX。

1 个答案:

答案 0 :(得分:0)

没关系,找到了我自己的解决方案。这对我有用,而不是给出span id,我给了Html.HiddenFor帮助者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>