确认 AutoPostBack DropDownLists(对话框)

确认 AutoPostBack DropDownLists

尽管通常在单击按钮时使用确认对话框,但是还可以在更改下拉列表时使用它们。例如,您可能具有一个当特定的 DropDownList Web 控件发生更改时会自动回发的网页。(DropDownList Web 控件具有一个 AutoPostBack 属性,如果设置为 True,只要 DropDownList 的选定项目发生更改就会导致窗体回发。)

直观地讲,您可能认为对 DropDownList 添加确认对话框与对 Button Web 控件添加这种对话框相同。也就是说,简单地将 DropDownList 的客户端 onchange 属性更改为如下内容:return confirm(...);。使用:

DropDownListID.Attributes("onchange") = "return confirm(...);"

遗憾的是,这并不会按期望工作,因为 AutoPostBackDropDownListonchange 属性将设置为会导致回发的 JavaScript,即对客户端 __doPostBack 函数的调用。当您自己借助编程方式设置 onchange 属性时,最后的结果是呈现的客户端 onchange 事件处理程序同时具有您的代码和对 __doPostBack 的调用:

<select onchange="return confirm(...);__doPostBack(...);">
...
</select>

记住,我们确实希望发生的情况是,如果确认返回 true,就调用 __doPostBack 函数,因为之后页面将会被回发。通过利用 Attributes 集合将 onchange 事件设置为:if (confirm(...)),我们可以完成这一操作,而该代码会生成以下标记,该标记正是我们所希望的:

<select onchange="if (confirm(...)) __doPostBack(...);">
...
</select>

乍看起来,这似乎会具有所期望的效果。如果用户从下拉列表中选择不同的项目,将会出现一个确认框。如果用户单击“OK”,该窗体将回发;如果用户单击“Cancel”,该窗体回发会暂停。尽管问题在于下拉列表维持用户选定的项目以启动下拉列表的 onchange 事件。例如,设想下拉列表加载正在进行选择的项目 x,然后用户选择项目 y。这将会触发下拉列表客户端 onchange 事件,它将会显示确认对话框。现在,设想用户点击“Cancel”- 下拉列表将仍然选择项目 y。我们希望的是将选择转回到项目 x。

要实现此目的,我们需要做两件事情:

1.

编写一个“记住”选定下拉列表项目的 JavaScript 函数。

2.

在下拉列表的客户端 onchange 事件中,如果用户单击“Cancel”,您需要将下拉列表转换回“已记住的”值。

步骤 1 必须为下拉列表和函数(当页面加载时运行,并且记录下拉列表的值)创建全局脚本变量。步骤 2 要求为下拉列表的客户端 onchange 属性更改为如下所示内容:

if (!confirm(...)) resetDDLIndex(); else __doPostBack();

其中 resetDDLIndex 是 JavaScript 函数,它将下拉列表选定的值返回到“已记住的”值。用于此目的的客户端脚本应该如下所示:

<select id="ddlID"
onchange="if (!confirm(...)) resetDDLIndex(); else __doPostBack(...);">
...
</select>
<script language="JavaScript">
var savedDDLID = document.getElementById("ddlID").value;
function resetDDLIndex() {
document.getElementById("ddlID").value = savedDDLID;
}
</script>

通过在 ClientSidePage 类中创建 helper 方法,这个必要的脚本可以轻松地生成。

Public Sub ConfirmOnChange(ByVal ddl As DropDownList, ByVal message As String)
'Register the script block
If Not IsStartupScriptRegistered("CSP-ddl-onchange") Then
RegisterStartupScript("CSP-ddl-onchange", _
"<script language=""JavaScript"">" & _
"var CSP_savedDDLID = " & _
document.getElementById('" & _
ddl.ClientID & "').value;" & vbCrLf & _
"function resetDDLIndex() {" & vbCrLf & _
"   document.getElementById('" & " & _
" ddl.ClientID & "').value = CSP_savedDDLID;" &
vbCrLf & _
"}" & vbCrLf & _
"</script>")
End If
ddl.Attributes("onchange") = _
"if (!confirm('" & message.Replace("'", "\'") & _
"')) resetDDLIndex(); else "
End Sub

要使用这段代码,简单地调用网页上每个 AutoPostBackDropDownList 的该方法,当网页上的选定项目发生更改时要在该网页上显示对话框。

原文:http://www.microsoft.com/china/msdn/library/webservices/asp.net/WorkwithClientSideScript.mspx?mfr=true

原文地址:https://www.cnblogs.com/josh/p/377171.html