在gridview中的下拉更改警报答案

【问题标题】：Alert on dropdown change in gridview在gridview中的下拉更改警报
【发布时间】：2014-04-23 12:49:06
【问题描述】：

我有一个带有下拉菜单的网格视图，每当在网格下拉菜单中进行更改并且用户导航到另一个页面而不单击保存按钮时，我都会在下面的 JS 中显示一条警报。如果用户单击“确定”，则允许您导航到另一个页面，并且此方案运行良好。

问题部分：

如果用户在显示的警报中单击取消，它将不允许导航到另一个页面并且将保持在同一页面中。现在，如果我在没有点击保存的情况下导航到另一个页面，则不会出现警报，第二次我无法在取消操作时发出警报。

保存按钮：

 <asp:Button ID="btnSave" runat="server"  OnClick="Save_Click" Text="Save"
       CssClass="button" OnClientClick="MySuperDuper.globalChange = false;" />

网格下拉菜单：

<asp:TemplateField HeaderText="Product">
<ItemTemplate>
<asp:DropDownList ID="ddlProduct" runat="server" Enabled="True"
DataTextField="Prod" DataValueField="Prod" OnSelectedIndexChanged="ddlProduct_Change"
onchange="MySuperDuper.globalChange = true;">
</asp:DropDownList>
</asp:TemplateField>

Javascript：

 <script type="text/javascript">

    var MySuperDuper = new function () {
        var _this = this;

        this.saving;
        this.navigateAwayMessage = "You have made some changes which" +
                           " will be lost if you leave this page. " +
                           "Do you want to leave this page?";

        this.checkForChanges = function () {
            if (!_this.saving && typeof (_this.globalChange) !=
               "undefined" && _this.globalChange) {
                if (document.all && event) {
                    MySuperDuper.globalChange = false;
                    event.returnValue = _this.navigateAwayMessage;
                }
                else {
                    MySuperDuper.globalChange = false;
                    return _this.navigateAwayMessage;
                }
            }
        }
    }

    window.onbeforeunload = function () {
        return MySuperDuper.checkForChanges();
    }

</script>

【问题讨论】：

标签： c# javascript jquery asp.net .net

【解决方案1】：

为什么在点击时将MySuperDuper.globalChange 设置为false？看来，通过这样做，您可以再次将其设置为 true 的唯一方法是更改 dropdown - 将其设置为 true。

您是否尝试过调用以下命令：

<asp:Button ID="btnSave" runat="server"  OnClick="Save_Click" Text="Save"
       CssClass="button" OnClientClick="return MySuperDuper.checkForChanges()" />

这是要求您的按钮返回您的方法的结果。如果true，那么您的按钮将继续正常运行 - 在这种情况下为Save_Click - 如果false 则不会。

在您的函数中，不是返回消息而是返回确认框的结果（可能是true 或false）- 在您的方法中显示确认框。

要返回确认框的结果，您只需执行以下操作：

return = confirm(this.navigateAwayMessage);

要么这样，要么干脆删除OnClientClick 事件，让您当前的onbeforeunload 方法处理其余的事情。

【讨论】：

我试过了，但取消操作时没有显示警报。
不会的。 Cancel 从确认框中返回 false，Ok 返回 true。 - 也就是说，你可以处理任何一种情况。

【解决方案2】：

protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
{
foreach (GridViewRow gvRow in GridView2.Rows)
{
    Control ctrl = gvRow.FindControl("ddl_jd");
    DropDownList ddl = ctrl as DropDownList;
    if (ddl != null)
        ddl.SelectedIndex = DropDownList3.SelectedIndex;
}
}

还要确保为 DropDownList3 设置 AutoPostBack="true"。

另一种方法（不是很干净或简单）是将以下代码添加到 Page_Load 方法中（并从 .aspx 文件中删除包含 onJDSelection 函数的脚本块）：

if (!Page.IsPostBack)
{
    string functionContent = "<script language=javascript> function onJDSelection()" + 
        "{ var selectedIndex = document.getElementById('" + DropDownList3.ClientID + "').selectedIndex;" + 
        "var grid = document.getElementById('" + GridView2.ClientID + "');  " +
        "for (var i = 1; i < grid.rows.length; i++) " +
            "{ var selObj = grid.rows[i].cells[0].getElementsByTagName(\"*\")[0]; selObj[selectedIndex].selected = true;} "+
        "}</script>";
    Page.RegisterStartupScript("MyScript", functionContent);
    DropDownList3.Attributes.Add("onchange", "onJDSelection()");
}.

请注意，在这种情况下，用于在 javascript 中检索 DropDownList3 和 GridView2 的 ID 是从后面的代码发送的，因为依赖 ASP .NET 生成的服务器控件 ID 不是很安全。如果您想保存下拉列表值（使用 javascript 更改），您还需要额外的代码。

【讨论】：