如何将 <div> 值传递给 ASP.Net MVC 中的另一个控制器？

Question

我有 Home 和 Customer 控制器

家庭控制器

public ActionResult Index()
{
    return view()
}

Index.cshtml

<div class="card" data-csid="jieg83ndks90">

</div>

When user click on above div it will redirect to Customer.cshtml on CustomerController, and also it has to get the div data-csid value(jieg83ndks90)

客户控制器

public ActionResult Customer()
{
    return view()
}

Note: I want to redirect from index.cshtml to Customer.cshtml and pass the value(jieg83ndks90) also to Customer.cshtml

Answer 1

你问了几个问题：

如何在JavaScript
如何在 JavaScript
如何在 JavaScript
如何在 URL
如何在操作方法中接收值

让我们从第一个开始，点击事件。由于您开始使用 ASP.NET MVC，我将假设 jQuery 包含在项目模板中。所以点击事件可能看起来像这样：

$('div.card').on('click', function () {

});

每当用户用 class="card" 单击 <div> 时，这将调用该（当前为空）函数。在该函数中，您想要获取被单击的 <div> 的 data-* 属性的值：

$('div.card').on('click', function () {
    let csid = $(this).data('csid');
});

现在您想重定向到 URL 并包含该值。在 ASP.NET MVC 中构建 URL 的方法有很多种，有些在 JavaScript 中使用时有有趣的解决方法。但让我们保持简单。使用 Url.Action 帮助程序，并记得将其用引号括在 JavaScript 中，因为它是一个字符串：

$('div.card').on('click', function () {
    let csid = $(this).data('csid');
    let url = '@Url.Action("Customer", "Customer")';
});

（我们鼓励您在浏览器中查看页面源代码以查看生成的内容。）您可以将值添加到 URL 的查询字符串中，此生成：

$('div.card').on('click', function () {
    let csid = $(this).data('csid');
    let url = '@Url.Action("Customer", "Customer")' + '?csid=' + csid;
});

然后用那个URL到redirect the user:

$('div.card').on('click', function () {
    let csid = $(this).data('csid');
    let url = '@Url.Action("Customer", "Customer")' + '?csid=' + csid;
    window.location.href = url;
});

重要说明： 差异可能看起来不重要，但理解正在发生的事情的语义是非常重要的。您没有将用户重定向到 Customer.cshtml。您正在将用户重定向到控制器上的 操作方法 。当那个 action 方法 returns 一个视图时，那个 view 将是 Customer.cshtml.

当您想使用查询字符串中的值时，这一点变得很重要。由于用户要转到操作方法，因此在操作方法中获取该值：

public ActionResult Customer(string csid)
{
    return View();
}

现在显然问题变成了...您打算用 做什么 csid 值。这几乎就是您问题的上下文结束的地方。此时您已经使用该值重定向了用户，如何使用该值取决于您。如果您想将它从控制器操作传递到视图，那么标准方法是在传递给视图的模型上设置值。例如：

public ActionResult Customer(string csid)
{
    var model = new SomeViewModel { CSID = csid };
    return View(model);
}

然后在您的视图中，您会将此行放在顶部以绑定到该模型：

@model SomeViewModel

从那里您可以在视图中的任意位置访问 Model.CSID。

如何将 <div> 值传递给 ASP.Net MVC 中的另一个控制器？

How to pass <div> value to another Controller in ASP.Net MVC?

asp.net-mvc

asp.net-mvc-5