如何将JavaScript int变量传递到ASP.NET MVC局部视图?

时间:2018-03-20 08:01:58

标签: javascript c# asp.net-mvc

在下面的代码中,我试图迭代geoMarkers并为每个代码创建一个Marker。这里的代码行需要一些帮助:    内容:@Html.Partial("~/Views/Search/_MyPartialView.cshtml", Model.ElementAt(' + i + '))

在上面的这一行中,我试图将JavaScript变量i传递给ASP.NET MVC调用,我知道在可以转换JavaScript变量的情况下搜索是不可能的。变成文字。在这种情况下,我想将i变成一个int,但我在语法上挣扎。 如何将i传递到@Html.Partial来电?请注意_MyPartialView.cshtml需要@model MyMarkerObject

谢谢!

@model List<MyMarkerObject>
@section scripts {
    <section class="scripts">
        <script type="text/javascript">

            var geoMarkers = @Html.Raw(Json.Encode(Model));

            // Using the JQuery "each" selector to iterate through the JSON list and drop marker pins
            $.each(geoMarkers, function (i, item) {
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(item.GeoLatitude[0], item.GeoLongitude[0]),
                    map: map,
                    title: item.GeoFormattedAddress[0],
                });

                ///////////////// SET ICON TYPE ////////////////////////
                var thisIcon;
                if (item.Source.includes("parking")) {
                    thisIcon = icons.parking.icon;
                } else if (item.Source.includes("hotel")) {
                    thisIcon = icons.hotel.icon;
                } else if (item.Source.includes("restaurant")) {
                    thisIcon = icons.restaurant.icon;
                }

                // Use a different color depending on the source
                marker.setIcon(thisIcon);

                ///////////////// CREATE MAP EVENTS ////////////////////

                // put in some information about each json object - in this case, the opening hours.
                var infowindow = new google.maps.InfoWindow({
                    ///////////////////////////////////////////////////
                    // HELP PLEASE HERE!
                    ///////////////////////////////////////////////////
                    content: `@Html.Partial("~/Views/Search/_MyPartialView.cshtml", Model.ElementAt(' + i + '))`
                });

                // finally hook up an "OnClick" listener to the map so it pops up out info-window when the marker-pin is clicked!
                google.maps.event.addListener(marker, 'click', function () {
                    infowindow.open(map, marker);
                });
            })

更新

添加_MyPartialView.cshtml

@model MyMarkerObject

@{
    String title = HttpUtility.HtmlDecode(Model.GetTitle());
    String type = Model.GetDataElementType().ToString();
}
<div class="searchResult" style="margin-bottom:1em;">
    <div style="font-weight:200;">
        <span data-feather="GetTypeFeatherIcon(Model.GetDataElementType().Type)"></span> @Model.GetSourceName() > @Model.Source.LocationCountry
            @foreach (String loc in Model.Data.Locations)
            {
                loc.ToString();
            }
    </div>
    <div style="font-size:1.1em;font-weight:bolder;">@Html.ActionLink(title, "Details", type, new { id = Model.Id, sourceCollection = Model.GENSource.Collection, ta = "seairesultdetails" }, null)</div>
    <div>@Model.GetSourceURL()</div>
    <div>@Model.Collector.DateTimeUTC</div>
</div>

2 个答案:

答案 0 :(得分:0)

当加载视图时,将首先加载所有服务器端标签(Razor),然后执行javascript代码,如果在加载代码后需要从JS调用服务器端代码,则在这种情况下需要使用异步Ajax调用。

这是您的代码的示例

控制器

      [HttpPost]
public ActionResult MyPartialView( MyMarkerObject myMarkerObject )
{
        return PartialView("~/Views/Search/_MyPartialView.cshtml", myMarkerObject );
}
//Javascript
 $.ajax({
     url: '@Url.Action("Search","MyPartialView")',
     type: 'POST',
     data: JSON.stringify(item),
     dataType: 'json',
     contentType: 'application/json; charset=utf-8',
     error: function (xhr) {
        alert('Error: ' + xhr.statusText);
     },
     success: function (result) {
         var infowindow = new google.maps.InfoWindow({
            content: result
        });
     },
     async: true,
     processData: false
  });

答案 1 :(得分:-2)

你如何传递变量&#34; i&#34;作为查询参数,让您的控制器解释它并根据需要使用它。

这样的事情:

@Html.Partial("~/Views/Search/_MyPartialView.cshtml?elementNo=" + i)

您也可以传递模型MyMarkerObject,然后根据需要进行处理。