image control with radio buttons

Question

3.00/5 (1 vote)

See more:

Hi experts,
I need a control which can hold an image and two radio buttons, like the one we have when we upload a pictures on fb / orkut.
1. Image
2. Delete radio button.
3. Cover radio button.[Set this image as cover of album]

i have created a user control with these three things.
On my aspx page on click of a button i need to add this user control.
Means, user will select the image using FileUpload and when he clicks on the button this user control should be loaded.
I am able to load the control. Check the following code.

protected void btnAddURL_Click(object sender, EventArgs e)
    {
        if (FileUpload1.HasFile)
        {
			//ItemList is an array list used to store the filename.
            ItemList.Add(FileUpload1.FileName);
             showImage();
        }
    }

    public void showImage()
    {
        
        PlaceHolder p = new PlaceHolder();

		//Create Thumbnail
        FileUpload1.SaveAs(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\" +    FileUpload1.FileName);
        System.Drawing.Image img1 = System.Drawing.Image.FromFile(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\" + FileUpload1.FileName);
        System.Drawing.Image bmp2 = img1.GetThumbnailImage(100, 100, null, IntPtr.Zero);
        bmp2.Save(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\thumbnail\L\" + FileUpload1.FileName);

		//Load the images selected by user
        for (int i = 0; i &lt;= ItemList.Count - 1; i++)
        {
            Control MyUserControl;
			// Load user control dynamically
            MyUserControl = LoadControl(&quot;MyControl.ascx&quot;);
			MyUserControl.ID = &quot;MyUserControl&quot; + cnt++;</pre>
			Image MyImage = (Image)MyUserControl.FindControl("Image1");
			// MyImage.ID = "Image" + cnt;
			MyImage.ImageUrl = "~/SaveImage/thumbnail/L/" + ItemList[i].ToString();
			p.Controls.Add(MyUserControl);
			Panel2.Controls.Add(p);
		}

Problem :
1> All images come on new line i want them next to each other.
2> How to detect which radio button is clicked as i have more than one images, and all have radio buttons.
3> How to capture click of radio button from aspx page?

Searched on google but could not find a solution for this. :(
Thanks in advance.

Posted 27-Jan-11 23:32pm

ubaidh sayed

Updated 27-Jan-11 23:37pm

Manas Bhardwaj

v2

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Steve Wellens · Accepted Answer · 2011-01-29T08:22:00

Solution 1

1> All images come on new line i want them next to each other.

Do you mean the user controls? Images by default display inline. You maybe able to change the way the usercontrol displays by setting it's style: style="display:inline"

2> How to detect which radio button is clicked as i have more than one images, and all have radio buttons.
3> How to capture click of radio button from aspx page?

Make sure autopostback is true for the radio buttons.

The event in the UserControl will not show up in the properties window. You have to set it manually.

User Control Markup:

<![CDATA[<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="UserControls_WebUserControl" %>
<asp:button id="Button1" runat="server" text="Button" />
<br />
<asp:radiobutton id="RadioButton1" runat="server" autopostback="True" >
    oncheckedchanged="RadioButton1_CheckedChanged" />

User Control Code behind:

public partial class UserControls_WebUserControl : System.Web.UI.UserControl
{
    public event EventHandler UC_RadioClicked;
    protected void RadioButton1_CheckedChanged(object sender, EventArgs e)
    {
        if (UC_RadioClicked != null)
            UC_RadioClicked(sender, e);
    }

Page Markup:

<uc1:webusercontrol id="WebUserControl1"  runat="server" onuc_radioclicked="UC_RadioClicked" xmlns:uc1="#unknown" />

Page Code Behind:

protected void UC_RadioClicked(object sender, EventArgs e)
 {
     RadioButton RB = sender as RadioButton;
     Response.Write("Radio button in user control clicked: " + RB.Parent.ID);
 }

Posted 29-Jan-11 8:22am

Steve Wellens

Updated 29-Jan-11 8:34am

v3

Comments

ubaidh sayed 31-Jan-11 7:22am

Hi Steve Wellens,
That worked for me :-)
But now i have a new problem.
I am adding UC on click of a button like this :
<pre lang="midl">Control MyUserControl;
// Load user control dynamically
MyUserControl = LoadControl("MyControl.ascx");</pre>

so its creating new object of UC on each click.
The UC contains delete radio button[delete the image], cover radio button[Set the image as cover of the album] and the image.
On all the uc created on click of button adds the UC with these three things.
So the problem is i m able to select cover radio button on all images which should not be the case as only one image can be set as the cover of album which means i should be able to select only one cover radio button of all the UC added.
I have given the same group name for both the rb.

Here is the complete code.
protected void btnAddURL_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile)
{
// Add File Name into array list for further reference
ItemList.Add(FileUpload1.FileName);

// Add URL to Text Box.
txtAddURL.Text = txtAddURL.Text + System.Environment.NewLine + System.IO.Path.GetFullPath(FileUpload1.PostedFile.FileName);

// Create Thumbnail.
FileUpload1.SaveAs(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\" + FileUpload1.FileName);
System.Drawing.Image img1 = System.Drawing.Image.FromFile(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\" + FileUpload1.FileName);
System.Drawing.Image bmp2 = img1.GetThumbnailImage(100, 100, null, IntPtr.Zero);
bmp2.Save(@"D:\ASP\Project_Dec_16\RealEstate\SaveImage\thumbnail\L\" + FileUpload1.FileName);
showImage();
}
}
public void show()
{
PlaceHolder p = new PlaceHolder();
p.Controls.Clear();
Panel2.Controls.Clear();

for (int i = 0; i <= ItemList.Count - 1; i++)
{

// Load user control dynamically
MyUserControl = LoadControl("MyControl.ascx");

MyUserControl.ID = "MyUserControl" + i.ToString() ;

// Find Radio Button
RadioButton rdb1 = (RadioButton)MyUserControl.FindControl("deleteimage");
RadioButton rdb2 = (RadioButton)MyUserControl.FindControl("setascover");

// Attach Group Name.
rdb1.GroupName = "G";
rdb1.ID = "Rb_ID_D" + i.ToString();
rdb1.AutoPostBack = false;
rdb1.CheckedChanged +=new EventHandler(rdb1_CheckedChanged);

//Attach Group Name.
rdb2.GroupName = "G";
rdb2.ID = "Rb_ID_C" + i.ToString();
rdb2.AutoPostBack = false;
rdb2.CheckedChanged += new EventHandler(rdb2_CheckedChanged);

//Attach URL to Image.
Image MyImage = (Image)MyUserControl.FindControl("Image1");

MyImage.ImageUrl = "~/SaveImage/thumbnail/L/" + ItemList[i].ToString();
p.Controls.Add(MyUserControl);
Panel2.Controls.Add(p);
}
}