Question

我无法检索表格单元格值并在脚本中使用该值。我尝试使用的脚本来自Google Directions服务。我想要检索的值将是起点和终点。我用Google搜索并尝试获得所需的许多不同方式。任何帮助将不胜感激。

<script type="text/javascript">
    var directionsDisplay;
    var directionsService = new google.maps.DirectionsService();
    var map;

    function calcRoute() {
        //var $tr = $(takenT).closest('td').siblings('td');
        //var start = $tr.find('td:eq(2)').text();
        //var end = $tr.find('td:eq(4)').text();

        //$('#takenT tr').each(function () {
        //    var start = $(this).find("td").eq(2).text();
        //});
        //$('#takenT tr').each(function () {
        //    var finish = $(this).find("td").eq(4).text();
        //});
        var start = st;
        var end = ft;
        //var start = "salem, or";
        //var end = "portland, or";
        var request = {
            origin: start,
            destination: end,
            travelMode: google.maps.TravelMode.DRIVING
        };
        directionsService.route(request, function (response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(response);
            }
        });
    }
    function init() {
        directionsDisplay = new google.maps.DirectionsRenderer();

        var mapDiv = document.getElementById('map-canvas');
        var mapOptions = new google.maps.Map(mapDiv, {
            center: new google.maps.LatLng(44.848452, -123.233989),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });
        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        directionsDisplay.setMap(map);

    }      

    google.maps.event.addDomListener(window, 'load', init);

   </script>

这是我正在使用的脚本。

<div class="tab-pane fade" id="taken">
        <table>
            <tr>
                <th>
                    @Html.ActionLink("EventType", "Index", new { sortOrder = ViewBag.NameSortParm, currentFilter = ViewBag.CurrentFilter })
                </th>
                <th>
                    Description
                </th>
                <th>
                    Start Trip
                </th>
                <th>
                    Scheduled Departure
                </th>
                <th>
                    @Html.ActionLink("Finish Trip", "Index", new { sortOrder = ViewBag.NameSortParm, currentFilter = ViewBag.CurrentFilter })
                </th>
                <th>
                    Scheduled Arrival
                </th>
            </tr>

            @foreach (var item in Model)
            {                    
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.EventType.TypeName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Description)
                    </td>                        
                    <td>
                        @Html.DisplayFor(modelItem => item.StartTrip)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ScheduledDeparture)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.FinishTrip)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ScheduledArrival)
                    </td>
                    <td>                   

                        @Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
                        @Html.ActionLink("Details", "Details", new { id = item.ID }) |
                        @Html.ActionLink("Delete", "Delete", new { id = item.ID }) |
                        <input type="button" id="btn_submit" value="Get Directions" onclick="calcRoute(@Html.DisplayFor(modelItem => item.StartTrip), @Html.DisplayFor(modelItem => item.StartTrip));" />                            
                    </td>
                </tr>
            }
        </table>
        <br/>

    </div>

这是我的桌子。

public abstract class Events
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    public int ID { get; set; }
    [StringLength(500, MinimumLength = 1)]
    public string UserTag { get; set; }
    public int EventTypeID { get; set; }

    [StringLength(50, MinimumLength = 0)]
    [Display(Name = "Brief Description")]        
    public string Description { get; set; }
    [Required]
    [StringLength(50, MinimumLength = 1)]
    [Display(Name = "Trip Begins")]
    public string StartTrip { get; set; }
    [Required]
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
    [Display(Name = "Time and Date of Departure")]
    public DateTime ScheduledDeparture { get; set; }
    [Required]
    [StringLength(50, MinimumLength = 1)]
    [Display(Name = "Trip Ends")]
    public string FinishTrip { get; set; }
    [Required]
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
    [Display(Name = "Time and Date of Arrival")]
    public DateTime ScheduledArrival { get; set; }

}

这是模型

Answer 1

好的，所以我解决了自己的问题，所以我想我应该发布我的解决方案。当然，它最终变得相当简单。

在我在视图中创建的按钮的“onclick”中我应该使用它 @ item.StartTrip和这个@ item.FinishTrip作为传递给我的JS函数的参数值。（我应该注意到，有一次我把它设置成这样但是忘了把单引号放在@ item.blah上，搞笑你想念的简单事物）

所以最终看起来像这样：

<input type="button" id="btn_submit" value="Get Directions" onclick="calcRoute('@item.StartTrip', '@item.FinishTrip' );" />

检索表格单元格值MVC 5

1 个答案: