Я добавляю много кнопок во время выполнения к моей форме. Когда я нажимаю эти кнопки, я хочу, чтобы всплыло окно подтверждения и спросило, уверен ли я удалить этот элемент.
Как мне поступить, сделав это? Каждая кнопка добавляется динамически, поэтому я ожидаю, что в этом случае должен быть добавлен подтверждающий текст. Нужно ли добавлять расширитель для каждой кнопки или мне нужно сделать его в файле aspx, а затем изменить targetID во время выполнения?
ОБНОВЛЕНИЕ
Panel div = new Panel();
div.CssClass = "BulletDiv";
content.Controls.Add(div);
HyperLink picture = new HyperLink();
picture.ImageUrl = "~/Icons/Ny_mappa.png";
picture.NavigateUrl = "?navID=" + item.Nav_ID + "&ddlID=" + ddlID;
div.Controls.Add(picture);
div.Controls.Add(new LiteralControl("<br/>"));
HyperLink description = new HyperLink();
description.CssClass = "BulletDiv_Text";
description.Text = item.Nav_Name;
description.ID = item.Nav_ID.ToString();
description.NavigateUrl = "?navID=" + item.Nav_ID + "&ddlID=" + ddlID;
div.Controls.Add(description);
Button eyda = new Button();
eyda.Text = "Eyda";
eyda.CommandArgument = item.Nav_ID.ToString();
eyda.Command += new CommandEventHandler(eyda_Command);
div.Controls.Add(eyda);
пробовали ли вы простой JavaScript?
onclick='return confirm("Are you sure you would like to delete this item?");'
добавьте это при добавлении кнопки следующим образом:
Button edya = new Button();
edya.Attributes.Add("onclick","return confirm(\"Are you sure you would like to delete this item?\");");
//... set other fields and add to page
В качестве альтернативы вы можете использовать JQuery :
eyda.CssClass = "confirm"; //When adding button on server side
Затем на стороне клиента добавьте следующий javascript (конечно, также добавив библиотеку jquery).
$(document).ready(function() {
$('.confirm').click(function() {
if (!confirm("Are you sure etc?")) {
return false; //prevent button event propogating
}
});
});
Если вы хотите по-настоящему умничать и добавить больше информации ...
eyda.CssClass = "confirm"; //When adding button on server side
eyda.Attributes.Add("SomeProperty","Some value, specific to this button");
$(document).ready(function() {
$('.confirm').click(function() {
var someValue= $(this).attr("SomeProperty");
if (!confirm("Are you sure you want to delete " + someValue)) {
return false; //prevent button event propogating
}
});
});
ОБНОВЛЕНИЕ: Измените фоновое изображение вот так ...
eyda.CssClass = "confirm"; //When adding button on server side
Таблица стилей
.confirm {
background-image: url('Images/ClickMe.gif');
background-repeat:no-repeat;
}
.clicked {
background-image: url('Images/Clicked.gif');
}
Javascript:
$(document).ready(function() {
$('.confirm').click(function() {
if (!confirm("Are you sure etc?")) {
$(this).addClass("clicked");
return false; //prevent button event propogating
}
//Not meaningful to change style here as a postback is about to occur...
//$(this).addClass("clicked");
});
});