Modal Dialog Box - return value not always returned
Could you please help me? I've created a Modal Dialog Box based on the code shown in this article: http://www.eggheadcafe.com/articles/javascript_modal_dialog.asp
In my sample code, I use this dialog three times: for a hyperlink, a button Button1 with the onclick attribute added and a button Button2 with the OnClientClick event. If I click the hyperlink, the return value from the dialog box that defines the dialog's button being clicked goes to a text box. But if I click either Button1 or Button2, I cannot get the return value, i.e. determine which of the dialog's buttons gets clicked.
Could you please help me find a correct way to get the dialog's return value? I'm especially interested in the case of Button1 with the onclick attribute added.
Below is my Page and code-behind test code.
== Page ==
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="ModalDialogTest1.aspx.vb" Inherits="ModalDialogTest1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<script language=开发者_StackOverflow中文版"javascript">
var ModalDialogWindow;
var ModalDialogInterval;
var ModalDialog = new Object;
ModalDialog.value = '';
ModalDialog.eventhandler = '';
function ModalDialogMaintainFocus()
{
try
{
if (ModalDialogWindow.closed)
{
window.clearInterval(ModalDialogInterval);
eval(ModalDialog.eventhandler);
return;
}
ModalDialogWindow.focus();
}
catch (everything) { }
}
function ModalDialogRemoveWatch()
{
ModalDialog.value = '';
ModalDialog.eventhandler = '';
}
function ModalDialogShow(Title,BodyText,Buttons,EventHandler)
{
ModalDialogRemoveWatch();
ModalDialog.eventhandler = EventHandler;
var args='width=350,height=125,left=325,top=300,toolbar=0,';
args+='location=0,status=0,menubar=0,scrollbars=1,resizable=0';
ModalDialogWindow=window.open("","",args);
ModalDialogWindow.document.open();
ModalDialogWindow.document.write('<html>');
ModalDialogWindow.document.write('<head>');
ModalDialogWindow.document.write('<title>' + Title + '</title>');
ModalDialogWindow.document.write('<script' + ' language=JavaScript>');
ModalDialogWindow.document.write('function CloseForm(Response) ');
ModalDialogWindow.document.write('{ ');
ModalDialogWindow.document.write(' window.opener.ModalDialog.value = Response; ');
ModalDialogWindow.document.write(' window.close(); ');
ModalDialogWindow.document.write('} ');
ModalDialogWindow.document.write('</script' + '>');
ModalDialogWindow.document.write('</head>');
ModalDialogWindow.document.write('<body onblur="window.focus();">');
ModalDialogWindow.document.write('<table border=0 width="95%" align=center cellspacing=0 cellpadding=2>');
ModalDialogWindow.document.write('<tr><td align=left>' + BodyText + '</td></tr>');
ModalDialogWindow.document.write('<tr><td align=left><br></td></tr>');
ModalDialogWindow.document.write('<tr><td align=center>' + Buttons + '</td></tr>');
ModalDialogWindow.document.write('</body>');
ModalDialogWindow.document.write('</html>');
ModalDialogWindow.document.close();
ModalDialogWindow.focus();
ModalDialogInterval = window.setInterval("ModalDialogMaintainFocus()",5);
}
</script>
<script language=JavaScript>
function OKCancel_1(BodyText, EventHandler) {
var Buttons = '';
Buttons = '<input type="submit" value="Cancel" class="butt" style="width:100px;" onclick=javascript:CloseForm("Cancel");> ';
Buttons += '<input type="submit" value="OK" class="butt" style="width:100px;" onclick=javascript:CloseForm("OK");> ';
ModalDialogShow("Dialog", BodyText, Buttons, EventHandler);
}
function NoYes(BodyText, EventHandler) {
var Buttons = '';
Buttons = '<input type="submit" value="No" class="butt" style="width:100px;" onclick=javascript:CloseForm("No");> ';
Buttons += '<input type="submit" value="Yes" class="butt" style="width:100px;" onclick=javascript:CloseForm("Yes");> ';
ModalDialogShow("Dialog", BodyText, Buttons, EventHandler);
}
function OKCancelReturnMethod() {
document.getElementById('OKCancelReturn').value = ModalDialog.value;
ModalDialogRemoveWatch();
}
function NoYesReturnMethod() {
document.getElementById('modalreturn').value = ModalDialog.value;
ModalDialogRemoveWatch();
}
</script>
<body>
<form id="form2" runat="server">
<div>
<asp:HyperLink ID="HyperLink3" runat="server"
NavigateUrl="javascript:OKCancel_1('OKCancel test','OKCancelReturnMethod()');">OK/Cancel_1
</asp:HyperLink>
<br /><br />
<asp:Label ID="Label1" runat="server" Text="OKCancelReturn:"></asp:Label>
<asp:TextBox ID="OKCancelReturn" runat="server"></asp:TextBox>
<br /><br />
<asp:Button ID="Button1" runat="server" Text="Button -> NoYes onclick" >
</asp:Button>
<br /><br />
<asp:Button ID="Button2" runat="server" Text="Button -> NoYes OnClientClick"
OnClientClick="javascript:NoYes('NoYes test','NoYesReturnMethod()');">
</asp:Button>
<br /><br />
<asp:Label ID="Label2" runat="server" Text="modalreturn:"></asp:Label>
<asp:TextBox ID="modalreturn" runat="server"></asp:TextBox>
</div>
</form>
</body>
</html>
== code-behind===
Partial Class ModalDialogTest1
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim message As String
message = "Test Message: Do you want to delete?"
Button1.Attributes("onclick") = GetConfirmationScript(message)
End Sub
Private Function GetConfirmationScript(ByVal message As String) As String
Dim output As String
output = "javascript:NoYes('" & message & "','NoYesReturnMethod()');"
Return output
End Function
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
OKCancelReturn.Text = modalreturn.Text
End Sub
End Class
Many thanks, Lev
You would need to have two NoYesReturnMethods, and pass a different one in onclick of Button1 and Button2.
OnClientClick="NoYes('NoYes test','NoYesReturnMethod1()')
(and similarly for button2 -> NoYesReturnMethod2.)
However this is probably not what you want to hear, but the code you've based this on is diabolically terrible. It's much more complicated than it needs to be and abuses eval, javascript: URLs, unescaped HTML string-bodging, chromeless popups, and discarding exceptions... it's like a grab bag of worst possible practices.
If all your cases are simply a message with yes/no buttons you would be better off sticking with a trivial window.confirm call. If you might need to include more involved dialogue-forms, try one of the many other in-page-dialogue-box scripts/plugins.
加载中,请稍侯......
精彩评论