我正在处理一个用ASP.net Web表单开发的非常大的项目。
我想替换浏览器的默认window.confirm实现,这样,每当调用Confirm方法时,都会显示一个新的自定义确认对话框。
因此,每当我单击带有确认对话框的按钮时:
<asp:Button runat="server" Text="What returns from Confirm?" OnClick="btnConfirm_Click" OnClientClick="confirm('are U sure')" />
将显示一个新的确认对话框,并且只有在用户答复以“是”(或“确定”)确认对话框之后,才会触发服务器端事件(btnConfirm_Click)。 如果用户回答“否”(或取消),则仅关闭确认对话框。
需求的另一个重要部分是保留客户端调用签名(带有asp:button的行),因为这意味着要遍历该项目并在数千个地方更改客户端调用签名。
问题是,是否有可能,如果可以,怎么办?
我找到了一种实现所需行为的方法,但未能使客户端签名/逻辑保持不变
<%@ 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>