点击事件后如何将特定元素的ID传递给后端?

huangapple go评论65阅读模式
英文:

How to transfer the id of a certain element to the backend after a click event?

问题

I am working on a certain page write now on my project that is responsible for listing movies and after you click them it links you to a page where you can see all the information about the specific movie you clicked on, now I am using SQL on my database and one of my Ideas to that is to transfer the id of the element being pressed after I already taken care of assigning the right id's to the hyperlink that is being clicked on based on the movie you clicked on. My question is how do I take the id of what is being clicked, transfering it to the backend so that I will be able to pull the right information from the database according to that same id.

这段代码目前正在处理一个项目中的特定页面,负责列出电影,当你点击它们后,它会链接到一个页面,你可以在那个页面上看到关于你点击的特定电影的所有信息,现在我正在使用数据库上的 SQL,并且我的一个想法是在已经处理了基于你点击的电影为超链接分配正确的 id 之后,传递被按下的元素的 id 给后端,以便我可以根据相同的 id 从数据库中提取正确的信息。我的问题是,如何获取被点击的内容的 id,并将其传递给后端,以便我可以根据同一 id 从数据库中提取正确的信息。

this is my code so far:

这是我的代码到目前为止:

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>";
            }
        }
    }
}

这段代码到目前为止创建了一个电影列表,并根据电影的描述分配了正确的 id,并将其发送回页面,唯一的问题是我需要知道如何获取被点击的电影的 id,以便我可以从数据库中传递正确的信息到页面。

I have tried approching multiple resources but none of them seemed to help.

我已经尝试了多个资源,但似乎都没有帮助。

英文:

I am working on a certain page write now on my project that is responsible for listing movies and after you click them it links you to a page where you can see all the information about the specific movie you clicked on, now I am using SQL on my database and one of my Ideas to that is to transfer the id of the element being pressed after I already taken care of assigning the right id's to the hyperlink that is being clicked on based on the movie you clicked on.My question is how do I take the id of what is being clicked, transfering it to the backend so that I will be able to pull the right information from the database according to that same id.
this is my code so far:

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 = &quot;&quot;;
        protected void Page_Load(object sender, EventArgs e)
        {
            string fName = &quot;contentDB.mdf&quot;;
            string tableName = &quot;moviesTbl&quot;;
            string sqlSelect = $&quot;select * from {tableName}&quot;;
            DataTable table = Helper.ExecuteDataTable(fName, sqlSelect);
            int length = table.Rows.Count;
            for(int i = 0; i &lt; length; i++)
            {
                movieLister += $&quot;&lt;a href=&#39;moviePage.aspx&#39; id=&#39;{table.Rows[i][&quot;MOVIEID&quot;]}&#39;&gt;&lt;div class=&#39;movie-container&#39; &gt;&lt;img src=&#39;{table.Rows[i][&quot;movieImageFile&quot;]}&#39;/&gt;&lt;div&gt;&lt;img src=&#39;favourites.png&#39; /&gt; {table.Rows[i][&quot;rating&quot;]}&lt;/div&gt;&lt;p&gt;{table.Rows[i][&quot;movieName&quot;]}&lt;/p&gt;&lt;/div&gt;&lt;/a&gt;&quot;;
            }
            
        }
    }
}

this piece of code makes essentially a list of movies and assigning the correct id's relative to movie's description and sending it back to the page, the only thing is I need to know what to do in order to take the id of what movie has been clicked so that I will be able to transfer the correct information to the page from the data base.

I have tried approching multiple resources but none of them seemed to help.

答案1

得分: 0

以下是您要翻译的内容:

&lt;a href=&#39;moviePage.aspx&#39; id=&#39;{table.Rows[i][&quot;MOVIEID&quot;]}&#39;&gt;
  &lt;div class=&#39;movie-container&#39; &gt;
    &lt;img src=&#39;{table.Rows[i][&quot;movieImageFile&quot;]}&#39;/&gt;
  &lt;div&gt;
  &lt;img src=&#39;favourites.png&#39; /&gt; {table.Rows[i][&quot;rating&quot;]}
&lt;/div&gt;
&lt;p&gt;{table.Rows[i][&quot;movieName&quot;]}&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;a href=&#39;moviePage.aspx?id={table.Rows[i][&quot;MOVIEID&quot;]}&#39;&gt; &lt;!-- Update this href to use the id as a query parameter --&gt;
  &lt;div class=&#39;movie-container&#39; &gt;
    &lt;img src=&#39;{table.Rows[i][&quot;movieImageFile&quot;]}&#39;/&gt;
  &lt;div&gt;
  &lt;img src=&#39;favourites.png&#39; /&gt; {table.Rows[i][&quot;rating&quot;]}
&lt;div&gt; &lt;!-- update this tag --&gt;
&lt;p&gt;{table.Rows[i][&quot;movieName&quot;]}&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;
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 = &quot;&quot;;
        protected void Page_Load(object sender, EventArgs e)
        {
            string id = Request[&quot;id&quot;];
            string fName = &quot;contentDB.mdf&quot;;
            string tableName = &quot;moviesTbl&quot;;

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

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

这是翻译好的内容,没有其他内容。

英文:

As you did not post the page, I am assuming that you are simply spitting out the movieLister string like so {%= movieLister %} This should generate a tags in the format you use in your for loop like so:

&lt;a href=&#39;moviePage.aspx&#39; id=&#39;{table.Rows[i][&quot;MOVIEID&quot;]}&#39;&gt;
  &lt;div class=&#39;movie-container&#39; &gt;
    &lt;img src=&#39;{table.Rows[i][&quot;movieImageFile&quot;]}&#39;/&gt;
  &lt;div&gt;
  &lt;img src=&#39;favourites.png&#39; /&gt; {table.Rows[i][&quot;rating&quot;]}
&lt;/div&gt;
&lt;p&gt;{table.Rows[i][&quot;movieName&quot;]}&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;

There are 2 issues with this HTML for what you want

  1. There are two closing div tags without an opening. This is likely a typo but will cause the rendering engine of the browser to get very confused (and likely the StackOverflow syntax highlighter as well)
  2. While each link has the id attribute pointing to the movie id, that information is not part of the url that will be loaded when you click the link as it is not in the href attribute

To fix both of these I would update the outputed html to look something like this:

&lt;a href=&#39;moviePage.aspx?id={table.Rows[i][&quot;MOVIEID&quot;]}&#39;&gt; &lt;!-- Update this href to use the id as a query parameter --&gt;
  &lt;div class=&#39;movie-container&#39; &gt;
    &lt;img src=&#39;{table.Rows[i][&quot;movieImageFile&quot;]}&#39;/&gt;
  &lt;div&gt;
  &lt;img src=&#39;favourites.png&#39; /&gt; {table.Rows[i][&quot;rating&quot;]}
&lt;div&gt; &lt;!-- update this tag --&gt;
&lt;p&gt;{table.Rows[i][&quot;movieName&quot;]}&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;

Then you should be able to update your page handler like so (note I am on a MacBook and cannot validate this ASPX code as .NET Core/5+ uses Razor Pages only):

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 = &quot;&quot;;
        protected void Page_Load(object sender, EventArgs e)
        {
            string id = Request[&quot;id&quot;];
            string fName = &quot;contentDB.mdf&quot;;
            string tableName = &quot;moviesTbl&quot;;

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

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

Important Security Notes

The above code is for demonstrating how to get the ID only. In production I would strongly suggest you either convert it to an int or parameterize it to avoid very simple SQL injection attacks.

I also strongly recommend you migrate to .NET Core/5+ and Razor pages as they make asking such questions here and on google much easier as they are self contained and easier to post the full source. Tim Corey on YouTube has great videos at all levels if you want to learn about Razor pages

huangapple
  • 本文由 发表于 2023年6月6日 10:05:32
  • 转载请务必保留本文链接:https://go.coder-hub.com/76411002.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定