javascript - 如何将 js 变量传递给 @Model.MyModel (MVC4)

Question

这是我的模型

public class AddressBook
{
    public string UserId { get; set; }
    public IList<Address> Addresses { get; set; }
    public AddressBook()
    {
        UserId = "";
        Addresses = new List<Address>();
    }
}

public class Address
{
    public string Company { get; set; }
    public string Title { get; set; }
    public string FName { get; set; }
    ...
 }

Controller 用地址列表构建地址簿。主页使用 AddressBook 模型 (@model mymodel.AddressBook)，我可以使用 Model.Addresses[index] 访问不同的地址。

在页面上，我显示了地址列表，每个地址都有一个“编辑”按钮(为了清楚起见，我去掉了 html 代码):

@model mymodel.AddressBook
...
@for (int i = 0; i < Model.Addresses.Count; i++)
{
    @Model.Addresses[i].Company
    @Model.Addresses[i].FName
    ...
    @:<input type="image" src="/images/edit.gif" onclick="addressEdit('@i'); return false;" title="Edit" />

}

当用户点击编辑按钮时，我调用 javascript addressEdit 并将所选地址的索引传递给它。

<script type="text/javascript">
    function addressEdit(index) {
        $('#FName').val('@Model.Addresses[index].FName');
        $('#Addr1').val('@Model.Addresses[index].Company');
        ...
    }
</script>

问题出在 jQuery 行 $('#FName').val('@Model.Addresses[index].FName');变量索引在 VS2012 中带有红色下划线，消息为“名称‘索引’在当前上下文中不存在”。

如何传递“index”的值来提取我需要的数据？

Answer 1

用一些类名将你的元素包裹在一个 span 中。也将循环中的所有内容都包装成一个 div。我还从标记中删除了 onclick 方法，因为我们将在 unobtrusive 中执行此操作方式。

@for (int i = 0; i < Model.Addresses.Count; i++)
{
  <div class='entry'>
     <span class='spanAddress'> @Model.Addresses[i].Company </span>
     <span class='spanFName'> @Model.Addresses[i].FName </span>       
     <img src="/images/edit.gif" class='editLink' />
  </div>
}

现在在你的 javascript 中

$(function(){

  $(".editLink").click(function(e){

     e.preventDefault();
     var _this=$(this);
     var fname=_this.closest("div.entry").find(".spanFName").html();      
     var add=_this.closest("div.entry").find(".spanAddress").html();    

     $('#FName').val(fname);
     $('#Address').val(add);

  });  

});