Asp Net MVC 5在局部视图中刷新表

时间:2015-01-27 11:19:22

标签: javascript asp.net asp.net-mvc asp.net-mvc-5

所以我遇到了一个小问题,我很难理解我应该做些什么来获得我想要/需要的结果。

所以我的应用程序应该显示过去2小时内某个对象的路径。当用户加载应用程序时,他们会看到分散在地图中的几个点,当他们点击其中一个对象时,显示它在过去2小时内创建的路径,并且我应该使用这些坐标更新我的表。现在,当我获得对象在控制器方法中所有的位置时,我调用填充局部视图。

这就是我开始所有这一切的方式(当用户点击执行以下操作的点时)

(我正在使用openlayers 3,但这与这个问题无关)

$.ajax({
          type: "GET",
          url: '/Controller/GetRoutes',
          dataType: "json",
          success: function (result) {
                alert('Added');
              
                var layerLines = new ol.layer.Vector({
                    source: new ol.source.Vector({
                        features: [
                            new ol.Feature({
                                geometry: new ol.geom.LineString(routes, 'XY'),
                                name: 'Line'
                            })
                        ]
                    })
                });

                         
                map.addLayer(layerLines);             
            

          },
          error: function (xhr, ajaxOptions, thrownError) {
              //some errror, some show err msg to user and log the error  
              alert(xhr.responseText);
  
          }
      });

因此,您可以从此代码中看到,方法GetRoutes()将负责获取有关对象所在位置的信息。

这是控制器(我省略了大部分负责绘制实际路线的代码,因为它有点粗糙)

 [HttpGet]
    public JsonResult GetRoutes()
    {

    var lastpoints = get an arraylist with all the points I want

   var name = get the name of the object 

    RouteInformation(lastPoints,name);

    return Json(lastPoints, JsonRequestBehavior.AllowGet);

    }

我知道我应该在这里改变一些东西,但我不知道是什么。 给我最后几点的方法不是我的,但是我需要使用它,所以我别无选择,只能接受它返回给我的arrayList。

这是RouteInformation方法

 public ActionResult RouteInformation(ArrayList routeList, string name )
       {

           List<ObjPoint> routes = routeList.OfType<ObjPoint>().ToList();

           List<ObjRoute> objRoutes = new List<ObjRoute>();

           objRoutes.Add(new ObjRoute()
                         {

                             name = name,
                             ObjPoints = routes
                          });

           return PartialView("RouteDetailsView", objRoutes);
       }

我的问题是更新/刷新该表,我在局部视图中有它,但我不知道我要做什么来更新该表与我想要显示的信息(我可以得到那些信息我只是似乎无法表现出来。)

ObjPoint由纬度,经度,日期,时间组成。

这是ObjRoute模型

 public class ObjRoute
{
    public string name { get; set; }
    public  List<ObjPoint> ObjPoints { get; set; }      

}

现在是观点......

这是“主视图”调用局部视图的方式

<div> 
@Html.Partial("routeDetailsView")
</div>

这是我的部分观点

@model webVesselTracker.Models.ObjRoute

@{
    ViewBag.Title = "RouteDetailsView";
    Layout = "~/Views/Shared/_Layout.cshtml";
}


<div>

    <table id="routeTable" class="table">
        <tr>
            
            <th>
               Name
            </th>
            <th>
                Latitude
            </th>
			<th>
                Longitude
            </th>
         
            <th></th>
        </tr>       

@if (Model != null) {

    foreach (var item in Model.ObjPoints)
    {
        
            <tr>				  
                <td>                  
                    @Html.DisplayFor(modelItem => item.Latitude)
                </td>
				<td>                  
                    @Html.DisplayFor(modelItem => item.Longitude)
                </td>      				
               
            </tr>
}
}

else
{
    <tr>
        <td>
          No object has been selected, please select one
        </td>

    </tr>
}
    </table>

</div>

现在我知道我可以通过在js文件中添加某种json请求并从那里构建表来实现这一点,但我想知道如何使用Razor以及我在哪里出错了的代码/逻辑。 我应该在别处添加一些ajax吗?

总结一下:

-User sees points. 
-User clicks point to see the route it made. 
-App draws the route and then sends the route information to a method  table so it can be added to the table
the user can see that information

感谢您的时间,如果我错过了什么,请指出,以便我能更好地解决或解释。

1 个答案:

答案 0 :(得分:0)

我终于放弃并查看了knockout.js,它设法解决了我遇到的所有问题

knockout.js