Wie übertrage ich die ID eines bestimmten Elements nach einem Klickereignis an das Backend?

Question

Ich schreibe mein Projekt auf einer Seite, die für die Auflistung von Filmen zuständig ist, und nachdem Sie darauf geklickt haben, werden Sie zu einer Seite weitergeleitet, auf der Sie alle Informationen zu dem spezifischen Film sehen können, auf den Sie geklickt haben. Jetzt verwende ich SQL auf meinem Datenbank besteht eine meiner Ideen darin, die ID des gedrückten Elements zu übertragen, nachdem ich dem angeklickten Hyperlink basierend auf dem von Ihnen angeklickten Film die richtige ID zugewiesen habe. Meine Frage ist, wie ich die ID des angeklickten Inhalts erhalte und sie an das Backend übertrage, damit ich basierend auf derselben ID die richtigen Informationen aus der Datenbank abrufen kann. Das ist mein Code bisher:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

namespace WebProject
{
    public partial class movie : System.Web.UI.Page
    {
        public string movieLister = "";
        protected void Page_Load(object sender, EventArgs e)
        {
            string fName = "contentDB.mdf";
            string tableName = "moviesTbl";
            string sqlSelect = $"select * from {tableName}";
            DataTable table = Helper.ExecuteDataTable(fName, sqlSelect);
            int length = table.Rows.Count;
            for(int i = 0; i < length; i++)
            {
                movieLister += $"<a href='moviePage.aspx' id='{table.Rows[i]["MOVIEID"]}'><div class='movie-container' ><img src='{table.Rows[i]["movieImageFile"]}'/><div><img src='favourites.png' /> {table.Rows[i]["rating"]}</div><p>{table.Rows[i]["movieName"]}</p></div></a>";
            }
            
        }
    }
}

Dieser Code nimmt im Wesentlichen eine Liste von Filmen, weist der Filmbeschreibung die richtige ID zu und sendet sie zurück an die Seite. Das Einzige, was ich wissen muss, ist, was ich tun muss, um die ID des Films zu erhalten, auf den geklickt wurde, damit ich Möglichkeit, die richtigen Informationen aus der Datenbank auf die Seite zu übertragen.

Ich habe versucht, mehrere Ressourcen zu nutzen, aber keine davon scheint zu helfen.

Answer 1

由于您没有发布该页面，我假设您只是像这样吐出 movieLister 字符串 {%= movieLister %} 这应该生成 a 标签的格式与您在 for 循环中使用的格式相同，如下所示：

<a href='moviePage.aspx' id='{table.Rows[i]["MOVIEID"]}'>
  <div class='movie-container' >
    <img src='{table.Rows[i]["movieImageFile"]}'/>
  <div>
  <img src='favourites.png' /> {table.Rows[i]["rating"]}
</div>
<p>{table.Rows[i]["movieName"]}</p>
</div>
</a>

对于您想要的内容，此 HTML 有 2 个问题

1. 有两个没有开头的结束 div 标签。这可能是一个拼写错误，但会导致浏览器的渲染引擎变得非常混乱（也可能导致 StackOverflow 语法荧光笔）
2. 虽然每个链接都有指向电影 ID 的 id 属性，但该信息不是您单击链接时将加载的 URL 的一部分，因为它不在 href 中 属性

为了解决这两个问题，我将更新输出的 html，使其看起来像这样：

<a href='moviePage.aspx?id={table.Rows[i]["MOVIEID"]}'> <!-- Update this href to use the id as a query parameter -->
  <div class='movie-container' >
    <img src='{table.Rows[i]["movieImageFile"]}'/>
  <div>
  <img src='favourites.png' /> {table.Rows[i]["rating"]}
<div> <!-- update this tag -->
<p>{table.Rows[i]["movieName"]}</p>
</div>
</a>

然后您应该能够像这样更新页面处理程序（请注意，我使用的是 MacBook，无法验证此 ASPX 代码，因为 .NET Core/5+ 仅使用 Razor Pages）：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

namespace WebProject
{
    public partial class movie : System.Web.UI.Page
    {
        public string movieLister = "";
        protected void Page_Load(object sender, EventArgs e)
        {
            string id = Request["id"];
            string fName = "contentDB.mdf";
            string tableName = "moviesTbl";

            string sqlSelect = $"select * from {tableName}";
            if (id.Length() > 0)
            {
                sqlSelect += $" where id = {id}"
            }

            DataTable table = Helper.ExecuteDataTable(fName, sqlSelect);
            int length = table.Rows.Count;
            for(int i = 0; i < length; i++)
            {
                movieLister += $"<a href='moviePage.aspx?id={table.Rows[i]["MOVIEID"]}'><div class='movie-container' ><img src='{table.Rows[i]["movieImageFile"]}'/><div><img src='favourites.png' /> {table.Rows[i]["rating"]}<div><p>{table.Rows[i]["movieName"]}</p></div></a>";
            }
            
        }
    }
}

重要安全说明

上面的代码只是演示如何获取ID。在生产中，我强烈建议您将其转换为 int 或将其参数化以避免非常简单的 SQL 注入攻击。

我还强烈建议您迁移到 .NET Core/5+ 和 Razor 页面，因为它们使在此处和 Google 上提出此类问题变得更加容易，因为它们是独立的，并且更容易发布完整源代码。如果您想了解 Razor 页面，YouTube 上的 Tim Corey 提供了各个级别的精彩视频