简体   繁体   中英

how to know which random image is clicked in asp.net

I have 12 random images from 2 files. I want to change the border color of an image whenever it is clicked. I also want to save which picture is clicked in a database. here is the code I am using for my random images from 2 folders: "adults" and "children"

    int i = 1, j=1;

    protected void Page_Load(object sender, EventArgs e)
    {
        string Image2Display1 = GetRandomImageAdult();
        RandomImg1.ImageUrl = Path.Combine("~/adults", Image2Display1);
        i++;
        if (RandomImg1.BorderColor.Equals()
        RandomImg1_click();
        string Image2Display2 = GetRandomImageChildren();
        RandomImg2.ImageUrl = Path.Combine("~/Children", Image2Display2);
        j++;

        string Image2Display3 = GetRandomImageChildren();
        RandomImg3.ImageUrl = Path.Combine("~/Children", Image2Display3);
        j++;

        string Image2Display4 = GetRandomImageAdult();
        RandomImg4.ImageUrl = Path.Combine("~/adults", Image2Display4);
        i++;

        string Image2Display5 = GetRandomImageChildren();
        RandomImg5.ImageUrl = Path.Combine("~/Children", Image2Display5);
        j++;

        string Image2Display6 = GetRandomImageAdult();
        RandomImg6.ImageUrl = Path.Combine("~/adults", Image2Display6);
        i++;

        string Image2Display7 = GetRandomImageChildren();
        RandomImg7.ImageUrl = Path.Combine("~/Children", Image2Display7);
        j++;

        string Image2Display8 = GetRandomImageAdult();
        RandomImg8.ImageUrl = Path.Combine("~/adults", Image2Display8);
        i++;

        string Image2Display9 = GetRandomImageAdult();
        RandomImg9.ImageUrl = Path.Combine("~/adults", Image2Display9);
        i++;

        string Image2Display10 = GetRandomImageChildren();
        RandomImg10.ImageUrl = Path.Combine("~/Children", Image2Display10);
        j++;

        string Image2Display11 = GetRandomImageAdult();
        RandomImg11.ImageUrl = Path.Combine("~/adults", Image2Display11);
        i++;

        string Image2Display12 = GetRandomImageChildren();
        RandomImg12.ImageUrl = Path.Combine("~/Children", Image2Display12);
        j++;


    }
    public string GetRandomImageAdult()
    {

        Random rnd = new Random();
        for (int ii = 1; ii <= i; ii++)
            rnd.Next();
        string[] images = Directory.GetFiles(MapPath("~/adults"));
        string Image2Display = images[rnd.Next(images.Length)];
        return Path.GetFileName(Image2Display);
    }

    public string GetRandomImageChildren()
    {
        Random   rnd = new Random();
        for (int jj = 1; jj <= j; jj++)
            rnd.Next();
        string[] images = Directory.GetFiles(MapPath("~/Children"));
        string Image2Display = images[rnd.Next(images.Length)];
        return Path.GetFileName(Image2Display);
    }

and here is the source:

<div>
    <asp:Image ID="RandomImg1" runat="server" Width="200px" />
    <asp:Image ID="RandomImg2" runat="server" Width="200px" />
    <asp:Image ID="RandomImg3" runat="server" Width="200px" />
    <asp:Image ID="RandomImg4" runat="server" Width="200px" />
    <asp:Image ID="RandomImg5" runat="server" Width="200px" />
    <asp:Image ID="RandomImg6" runat="server" Width="200px" />
    <asp:Image ID="RandomImg7" runat="server" Width="200px" />
    <asp:Image ID="RandomImg8" runat="server" Width="200px" />
    <asp:Image ID="RandomImg9" runat="server" Width="200px" />
    <asp:Image ID="RandomImg10" runat="server" Width="200px" />
    <asp:Image ID="RandomImg11" runat="server" Width="200px" />
    <asp:Image ID="RandomImg12" runat="server" Width="200px" />

</div>

please help me with probably "ImageButton_Click". I don't know how to do this. thanks.

Provide a common class to all images like "prodImage" and then apply this jquery code on it:

$('.prodImage').click(function(){
   var imageId = $(this).attr('id');   // imageId is the id of clicked image
   // push these image in an array and save that array in db or save individually in db
});

First of all use ImageButton that can have clicks and there you can know that they have clicked.

<asp:ImageButton runat="server" ID="imbBtn1" ImageUrl="~/img/Logos/promidea.png" OnClick="imbBtn1_Click" />

and second do not re-initialize the buttons on ever post back using the IsPostBack

 protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
           string Image2Display1 = GetRandomImageAdult();
           RandomImg1.ImageUrl = Path.Combine("~/adults", Image2Display1);
            i++;

     //// rest of the code

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM