Arrays 在MVC4中从数组中获取变量并通过jQueryAjax发送到控制器

我正在使用foreach在MVC 4视图中迭代一个数组：

@model dynamic
@foreach (var item in Model)
        {
            <tr class="row">
                <td>@Html.Label("", (string)item.DisplayName)</td>
                <td><a href="@Url.Action(item.ViewName, "Reporting", new { @name = "SendToFilter", ReportItemId = item.ReportItemId, MimeType = item.MimeType })" alt="A Link"><span class="glyphicon glyphicon-folder-open" id="btnOpen" data-edit-id="OpenDocument" title="@Text.Get(Text.eTextType.Button, "Open")"></span></a></td>
            </tr>
        }

我宁愿使用：

<td><a href="#" onclick="SendToFilter()" alt="A Link"><span class="glyphicon glyphicon-folder-open" id="btnOpen" data-edit-id="OpenDocument" title="@Text.Get(Text.eTextType.Button, "Open")"></span></a></td>

---

并通过ajax post请求在后台发送变量，但ReportItemId和MimeType来自控制器，我在foreach循环中获取它们。如何从javascript函数访问这些变量？我真的不想把变量附加到链接标签上。这是可能的吗？

只要在razor标记中为链接构建正确的

href

值，就可以在进行ajax调用时使用相同的值

将css类添加到锚定标记中，以便我们以后可以将其用于jQuery选择

<td>
    <a class="ajaxLink" 
         href="@Url.Action(item.ViewName, "Reporting", new { @name = "SendToFilter", 
         ReportItemId = item.ReportItemId, MimeType = item.MimeType })" 
         alt="A Link">
        <span class="glyphicon glyphicon-folder-open" data-edit-id="OpenDocument"
            title="@Text.Get(Text.eTextType.Button, "Open")"></span>
    </a>
</td>

如果出于任何原因不希望将项目保留在href值中，则可以将这些项目保留在锚定标记的html 5数据属性中，并在单击事件中读取它们，并在调用

$.post

之前将其附加到url中

<td>
    <a class="ajaxLink" 
         href="@Url.Action(item.ViewName, "Reporting")" 
         data-name="SendToFilter" data-reportitemid="@item.ReportItemId" 
         data-mime="@item.MimeType" 
         alt="A Link"> Link Text </a>
</td>

---

但是这不是仍然将变量附加到标签上，这意味着它们在页面上吗？这是我试图避免的，如果可能的话，这可能是不可能的。如果没有，我确实喜欢这个解决方案。如果需要，您可以将这些变量保存在锚标记的HTML5数据属性中，并在进行$.post调用之前读取它们并附加到url。请在答案中查看我的编辑。此代码无效。由于某种原因，我的变量显示为未定义。我认为我的应用程序中的某些内容与此代码冲突，因为它在JSFiddle.My bad中运行良好！数据属性使用小写字符。我更新了答案。这是一个工作样本。

$(function(){

   $("a.ajaxLink").click(function(e){

     e.preventDefault();  // prevent the default click behaviour

     $.post($(this).attr("href"),function(response){
        //do something with the response
       // reload to some other page
       // window.location.href="@Url.Action("ReportListing","Report")";
     });

   });    

});

<td>
    <a class="ajaxLink" 
         href="@Url.Action(item.ViewName, "Reporting")" 
         data-name="SendToFilter" data-reportitemid="@item.ReportItemId" 
         data-mime="@item.MimeType" 
         alt="A Link"> Link Text </a>
</td>

$(function(){

   $("a.ajaxLink").click(function(e){

     e.preventDefault();  // prevent the default click behaviour
     var _this=$(this);
     var myUrl=_this.attr("href");
     myUrl+="?name="+_this.data("name");
     myUrl+="&reportItemId="+_this.data("reportitemid");
     myUrl+="&MimeType="+_this.data("mime");
     alert(myUrl);

     $.post(myUrl,function(response){
        //do something with the response
       // reload to some other page
       // window.location.href="@Url.Action("ReportListing","Report")";
     });

   });    

});