Click here to Skip to main content
15,894,740 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I must create a series of ImageButton inside a DIV

ASP.NET
<div style="float:left; width:105px">
  <asp:ImageButton ID="ImageButton3" runat="server" ImageAlign="Middle" ImageUrl="~/Immagini/Arredi/thumbnails/File_-09.jpg" Width="100px" OnClick="ImageButton3_Click1"/>A1
</div>


the HtmlGenericControl can create Html tags but not asp. net

System.Web.UI.HtmlControls.HtmlGenericControl dynDiv = new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");
       dynDiv.ID = "dynDivCode";
       dynDiv.Style.Add(HtmlTextWriterStyle.BackgroundColor, "Gray");
       dynDiv.Style.Add(HtmlTextWriterStyle.Height, "20px");
       dynDiv.Style.Add(HtmlTextWriterStyle.Width, "300px");
       dynDiv.InnerHtml = "I was created using Code Behind";
       this.Controls.Add(dynDiv);


there is a way to create ImageButton and Properties ?

What I have tried:

The Div I can create it

System.Web.UI.HtmlControls.HtmlGenericControl dynDiv = new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");


but the ImageButton inside the Div ?
Posted
Updated 21-Jan-18 21:54pm

<asp:Panel style="float:left; width:105px" runat="server" ID="myPanel">
    <asp:ImageButton ID="ImageButton3" runat="server" ImageAlign="Middle" ImageUrl="~/Immagini/Arredi/thumbnails/File_-09.jpg" Width="100px" OnClick="ImageButton3_Click"/>A1
</asp:Panel>


protected void Page_Load(object sender, EventArgs e)
{
        ImageButton newButton = new ImageButton();

        newButton.ID = "DynamicImageButton" + i.ToString();
        newButton.ImageAlign = ImageAlign.Middle;
        newButton.ImageUrl = "~/Immagini/Arredi/thumbnails/File_-09.jpg"; // change as needed
        newButton.Width = 100;
        newButton.Click += NewButton_Click;
        newButton.CommandArgument = i.ToString();

        myPanel.Controls.Add(newButton);

        Literal newLiteral = new Literal();

        newLiteral.Text = "Button " + i.ToString();

        myPanel.Controls.Add(newLiteral);
}

private void NewButton_Click(object sender, ImageClickEventArgs e)
{
    ImageButton b = (ImageButton)sender;

    System.Diagnostics.Debug.WriteLine("Button " + b.CommandArgument + " was clicked");
}
 
Share this answer
 
Comments
Dotnet_Dotnet 19-Jan-18 10:58am    
in code window

setbutton.controls.add( myPanel)
I Solved using a DataList with ImageButton

<!-- DataList Images -->
        <div style="overflow-x:scroll; overflow-y:no-content; height:280px"
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
              <ContentTemplate>
                  <!-- RepeatColumns="0" DataList Horizontal -->
                 <asp:DataList ID="DataList1" runat="server" RepeatDirection="Horizontal" RepeatLayout="Table" RepeatColumns="0">
                          
                   <ItemTemplate>
                    <td>                       
                       <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl='<%# Container.DataItem %>' Height="200px" OnClick="ImageButton1_Click" ImageAlign="Middle" EnableTheming="False" CssClass="CCSImageButton"/>
                    </td>
                    </ItemTemplate>
                 </asp:DataList>
              </ContentTemplate>             
            </asp:UpdatePanel>
        </div>   


and cs file

C#
protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
    {
         ...... other operation
    }
 
Share this answer
 
Don't just copy and paste.There is a hack that you can do with CSS and it will help you to position image buttons correctly inside div's.

c# - Image button inside div position - Stack Overflow[^]
 
Share this answer
 
by Solution 2
newButton.Click += NewButton_Click;


by entering a breakpoint on NewButton_Click , the code does not pass

private void NewButton_Click(object sender, ImageClickEventArgs e)
{
    ImageButton b = (ImageButton)sender;

    System.Diagnostics.Debug.WriteLine("Button " + b.CommandArgument + " was clicked");

I need ImageUrl to visulize in another control
ex: ImageFromThumb.ImageUrl = "url"

}


To perform a click on Image operation, I should at least pass ImageUrl

------------- other possibility
I can create

protected override void OnInit(EventArgs e)
    {
        //create a new server control  
        ImageButton image = new ImageButton();
        //we must specify an unique ID of that control   
        image.ID = "image1";

        image.ImageUrl = "~/Immagini/Arredi/thumbnails/File_55Frecce-106.jpg";
        image.Width = 100;
        image.OnClientClick = "ImgShow()";  

        //has no effect
        // image.OnClientClick = "ImgShow(image.ImageUrl)"
        
        //create a new LiteralControl  
        LiteralControl createDiv = new LiteralControl("<div>");
        //add both of them into the page  
        Page.Form.Controls.Add(createDiv);
        Page.Form.Controls.Add(image);
        LiteralControl endDiv = new LiteralControl("</div>");
        Page.Form.Controls.Add(endDiv);
        base.OnInit(e);
    }


and on .aspx file

<script type="text/javascript">
    function ImgShow(src)
    {
        var img = document.createElement("img");
        img.src = src;
        img.width = width;
        img.height = height;
        img.alt = alt;

        // This next line will just add it to the <body> tag
        document.body.appendChild(img);
    }

</script>


the purpose is to have n ImageButton and click on a display on an ImageButton control.

the problem is pass a parameter (ImageUrl) to function ImgShow()
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900