如何将 actionlink 的 id 值传递到我的 Asp.net Mvc 项目中的 javascript 函数

Question

我有一个 table 部门。现在我为每个部门创建了控制器，每个部门都有 index.cshtml。但是他们使用相同的功能。我在每个索引页中对他们的 departmentId 进行了硬编码。例如，部门 IT 的 departmentId = 1

public class ItController : Controller
    {
        // GET: It
        public ActionResult Index()
        {
            return View();
        }
    }

在它的索引页面中，我用 decleration var id = 1; 进行了硬编码；像这样

<div class="panel panel-body">

<div class="col-md-4 table-responsive" id="productsTable"></div>
</div>

 <script type="text/javascript">

var id = 1; // for the department that id is 1 so I have to create index for every department and hard code like this


 function AllProductsByDepartmentId(id) {

            var tbl = $('#productsTable');
            $.ajax({
                cache: false,
                url: '/Home/GetAllProductsByDepartmentId?id=' + id,
                contentType: 'application/html ; charset:utf-8',
                type: 'GET',
                dataType: 'html',
                success: function (result) {
                    tbl.empty().append(result);
                },
                error: function () {

                }

            });

        }

</script>

但是这样做并不好，因为如果通过一些重新更改部门的 Id 或者当我下次创建一个新部门时我必须再次硬编码...... 我想要的是首先我想从数据库动态填充我的 _Layout 中的那些部门。所以我创建了控制器

    public class DepartmentsController : Controller
    {
        private ApplicationDbContext db = new ApplicationDbContext();

        // GET: Departments
        public async Task<ActionResult> Index()
        {
            return View(await db.Departments.ToListAsync());
        }
    }

这是我的 Departments PartialView，我想在 _Layout.cshtml 中填充它，但我不知道该怎么做以及如何 link 它们成为一个函数...

@model IEnumerable<Inventory.Models.Departments>
@foreach (var item in Model) {
     @Html.ActionLink(modelItem => item.DepartmentName???????, ??????, ?????, new { id = item.DepartmentId })

  }

和link他们到这个java函数

function AllProductsByDepartmentId(id)
{
   // ......
}

我想我必须创建另一个通用控制器来为所有人创建一个索引页 departments.But 如何动态创建动作 link 并将它们 link 到 java脚本函数。提前致谢！

Answer 1

在这种情况下不需要使用@Html.ActionLink()来生成link。你 foreach 循环可以只是

@foreach (var item in Model) {
    <a href="#" class="details" data-id="@item.DepartmentId">@item.DepartmentName</a>
}

请注意，DepartmentId 的值作为 data 属性添加到 link。

那么你的脚本就是

var url = '@Url.Action("GetAllProductsByDepartmentId", "Home")';
var tbl = $('#productsTable');
$('.details').click(function() {
    tbl.load(url, { id: $(this).data('id') });
});

如何将 actionlink 的 id 值传递到我的 Asp.net Mvc 项目中的 javascript 函数

How to Pass id value of actionlink to javascript function in my Asp.net Mvc Project

javascript

asp.net-mvc

actionlink