Я работаю над очень большим проектом, разработанным в веб-формах ASP.net.
Я хотел бы заменить стандартную реализацию окна window.confirm в браузере, чтобы при вызове метода подтверждения отображался новый диалог подтверждения.
Поэтому всякий раз, когда я нажимаю кнопку с диалоговым окном подтверждения:
<asp:Button runat="server" Text="What returns from Confirm?" OnClick="btnConfirm_Click" OnClientClick="confirm('are U sure')" />
Появится новое диалоговое окно подтверждения, и событие на стороне сервера (btnConfirm_Click) будет запущено только после того, как пользователь ответит, чтобы подтвердить диалог с «ДА» (или «ОК»).
Если пользователь отвечает «НЕТ» (или отменяет), диалоговое окно подтверждения просто закрывается.
Другая важная часть требования заключается в сохранении подписи вызова на стороне клиента (строка с кнопкой asp:), поскольку это означает, что нужно перейти к проекту и изменить подпись вызова на стороне клиента в тысячах мест.
Вопрос в том, возможно ли это вообще, и если да, то как?
Я нашел способ реализовать желаемое поведение, но не смог оставить неизменным подпись / логику на стороне клиента
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="CustomConfirmPOC_Web.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Customized Confirm</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"/>
</head>
<body>
<form runat="server">
<asp:Button runat="server" ID="btnConfirm" OnClick="btnConfirm_Click" hidden ="hidden"/>
</form>
<button id="btn1" class="ui-button" onclick="confirm('Here goes your <strong> slogan </strong> !')
<br />
<p id="demo"></p>
</body>
<script type = "text/javascript">
$(document).ready(function () {
document.getElementById("btnConfirm").hidden = true;
$("#btn1").click(function(){
confirm('Here goes your <strong> slogan </strong> !')
.then(function (answer) {
//Here goes desired behaviour implementation according to answer from the confirm (true or false)
//For example:
if (answer==true) {
var confirm_value = document.createElement("INPUT");
confirm_value.type = "hidden";
confirm_value.name = "confirm_value";
confirm_value.value = true;
document.forms[0].appendChild(confirm_value);
var cntrl = document.getElementById("btnConfirm");
if (cntrl != undefined) {
cntrl.click();
}
}
var demo = document.getElementById("demo");
demo.innerHTML = "Confirmation dialog returned " + answer;
$(demo).show().fadeOut( 3000 );
});
});
});
window.confirm = function (message) {
var defer = $.Deferred();
$(document.createElement('div'))
.attr({ class: 'confirm' })
.html(message)
.dialog({
buttons: {
"Ok": function () {
defer.resolve(true);
//ExecuteYes() ?;
$(this).dialog("close");
},
"Cancel": function () {
defer.resolve(false);
$(this).dialog("close");
}
}
,
close: function () {
defer.resolve(false);
$(this).dialog('destroy').remove();
},
draggable: true,
modal: true,
resizable: false,
width: 400,
height: 200,
title: 'Custom Confirm Dialog'
});
return defer.promise();
};
</script>
</html>