通过@ Ajax.ActionLink传递id的值 [英] Passing the value of an id with @Ajax.ActionLink

问题描述

目标:通过@Ajax.ActionLink()将用户ID和两个时间戳传递给控制器​​. 到目前为止，我所拥有的:

The goal: to pass an userId and two timestamps to the controller via an @Ajax.ActionLink(). So far what I have:

<table class="table table-hover ALStable thickborder" id="resultsTable">
  <thead>
    <tr>
      <th>Username</th>
      <th>Access level</th>
    </tr>
  </thead>
  <tbody>
    @for (int i = 0; i < Model.Users.Count(); i++)
    {
      <tr>
        <td>
          @Ajax.ActionLink(Model.Users[i].Username, "UserTracking", new { userId = Model.Users[i].Id }, new AjaxOptions { UpdateTargetId = "userTracking" }, new { @style = "font-weight:bold;" })
        </td>
        <td>@Html.DisplayFor(m => m.Users[i].AccessDescription, new { htmlAttributes = new { @class = "form-control", @style = "width: 100%" } })</td>
      </tr>
    }
  </tbody>
</table>

<h3 class="text-primary shadowedtext">Time filter</h3>
<p>Show from:</p>
<div id="datetimepicker1"></div>

<script type="text/javascript">
  $(function () {
    $('#datetimepicker1').datetimepicker({
      inline: true,
      format: 'DD MMMM YYYY',
      defaultDate: moment().subtract(1, "days")
    }).on("dp.change", function (e) {
      setDate(e.date.valueOf(), 0);
    });
  });
</script>

@Html.HiddenFor(m => m.FromDate)

<p>Show until:</p>
<div id="datetimepicker2"></div>

<script type="text/javascript">
  $(function () {
    $('#datetimepicker2').datetimepicker({
      inline: true,
      format: 'DD MMMM YYYY',
      defaultDate: moment()
    }).on("dp.change", function (e) {
      setDate(e.date.valueOf(), 1);
    });
  });
</script>

@Html.HiddenFor(m => m.UntilDate)

<div id="userTracking"></div>

控制器方法

public ActionResult UserTracking(int userId, long from, long until)
{
  Models.GPSInformation detail = new Models.GPSInformation();
  .....
  return PartialView(detail);
}

页面上还有两个日期时间选择器，用户可以在其中选择日期间隔.为了进行测试，我用伪数据填充了from和直到参数.
解决了该部分，其中用选定日期的时间戳填充了id，但是单击操作链接时，我无法传递这两个值.
任何想法，帮助都将不胜感激.

Also there are two date time pickers on the page, where the user can select the date interval. For testing I've filled the from and until parameters with dummy data.
That part is solved where the id is populated with the selected date's timestamp, but I can't pass those two values when the actionlink is clicked.
Any ideas, help is really appreciated.

推荐答案

而不是使用Ajax.ActionLink()，请使用jquery ajax方法来更新DOM.

Rather than using Ajax.ActionLink(), use jquery ajax method to update the DOM.

更改html以生成链接

Change the html to generate the links

@for (int i = 0; i < Model.Users.Count(); i++)
{
  <a href="#" class="details" data-userid="@Model.Users[i].Id">Model.Users[i].Username</a>
}

然后包含一个脚本来处理链接.click()事件，调用服务器并更新DOM.注意，我在这里假设要传递给控制器​​方法的其他值是2个隐藏输入(FromDate和UntilDate)的值

Then include a script to handle the links .click() event, call the server and update the DOM. Note I'm assuming here that the additional values you want to pass to the controller method are the values of your 2 hidden inputs (FromDate and UntilDate)

var url = '@Url.Action("UserTracking")';
var placeholder = $('#userTracking');
$('.details').click(function() {
  var userid = $(this).data('userid');
  var from = $('#FromDate').val();
  var until = $('#UntilDate').val();
  placeholder.load(url, { userId: userid, from: from, until: until });
});

这篇关于通过@ Ajax.ActionLink传递id的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！