how to add Drag and Drop function to dynamic image ?

gavriel ankri

12y1.8k.NET

hello. I created an image to be draggable:

however, I want to create the image dynamically:

Image tblImg = new Image();

tblImg.ImageUrl = "image/table3.png";

can i add the function ondragstart="drag(event)" to the dynamic image in the code ?

8 Replies

Know the answer? Post it — somebody with the same question will find it here.

Manish Kumar Choudhary12y ago
Accepted answer
Hi gavriel ankri,
Use
```
tblImg.Attributes.Add("ondragstart", "drag(event);");
```
+1
gavriel ankri12y ago
ok. thank you !
0
Manish Kumar Choudhary12y ago
Hi gavriel ankri,,
For doing that you have to remove that Image control when you click that button and add another image control after that.
0
gavriel ankri12y ago
yes. but I want to create another image each time I click the button.
if I move the image and then press the button, the image come back to the original place
0
Manish Kumar Choudhary12y ago
int num = 0;
num = int.Parse(ViewState["num"].ToString());
num++;
ViewState["num"] = num.ToString();

in Button click. Its working fine its zooming the image.
0
gavriel ankri12y ago
I created it on Page_load like this:

and in the button click I just did num++

protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ViewState["num"] = 1;
}
else
{
int num = int.Parse(ViewState["num"].ToString());
if (num > 0)
{
Image tblImg = new Image();
tblImg.ImageUrl = "image/table3.png";
tblImg.ID = "tblImg" + num;
tblImg.Width = 40 + num;
tblImg.Attributes.Add("ondragstart", "drag(event);");
tblImg.Attributes.Add("draggable", "true");

Panel1.Controls.Add(tblImg);
Panel1.DataBind();

}
}
protected void btnAddTable_Click(object sender, EventArgs e)
{
num = int.Parse(ViewState["num"].ToString());
num++;
ViewState["num"] = num.ToString();
}

0
Manish Kumar Choudhary12y ago
Hi gavriel ankri
As i think you placed your code inside button click events so every time you click that button new instance of image is created so it goes back.
0
gavriel ankri12y ago
great. its work !

I can move the dynamic image now, but do you know why when I click the button another time, everything goes back. I mean I can move the image, but when I click the button, the image came back to the first place.
can I make it stay in the new place after page refresh ?
0