如何以编程方式更改OnClientClick事件并调用它？

Question

我有一个包含播放列表的ListView.如果用户想要编辑相册,他们会单击编辑链接,并允许他们删除或添加歌曲到播放列表.如果用户想要在保留原始播放列表的同时保存新播放列表,则会单击"另存为"按钮.这是应该发生的事情:

如果用户单击"另存为"并且他们没有更改名称,我想显示一条警告,告诉他们必须更改名称.

如果用户单击"另存为"并且他们已更改名称,我想显示他们确实要保存它的确认.

目前,正在发生的事情是,如果我在我的代码中放入类似下面的内容,脚本将不会注册,直到第二次单击和注册的任何脚本保持注册意味着如果我最终更改名称并且警报脚本已注册之前,它将显示警报而不是确认.这是代码:

if (newname == oldname)
{
    btnSaveAs.OnClientClick =
  "javascript:alert('Save As requires you to change the name of the playlist. Please
   change the name and try again.');";
}
else
{
    btnSaveAs.OnClientClick = "javascript:confirm('Are you sure you want to save the
    playlist" + newname + "?');";
}

我也尝试添加返回false,因此它不会进行回发,但如果我这样做,那么当我在确认上单击OK时,它实际上并没有做任何事情.

Answer 1

SLaks说的是正确的,你误解了页面生命周期.在单击"另存为" 之前,需要在页面上使用javascript代码.在您所描述的示例中,用户更改标题/名称并单击"另存为",之后将javascript代码应用于按钮.第二次单击"另存为"时,弹出上一个示例的验证结果.

选项1:使用验证器控件

解决此问题的最简单方法是使用RegularExpressionValidator控件来比较值.

标记片段:

<asp:Label ID="lblName" runat="server" Text="Name: " />
<asp:TextBox ID="txtName" runat="server" />
<asp:RegularExpressionvalidator ID="valName" runat="server" ControlToValidate="txtName" ErrorMessage="You must change the name before saving" Display="Dynamic" />

<asp:Button ID="btnSaveAs" runat="server" OnClick="btnSaveAs_Click" Text="Save As" CausesValidation="True" />

在绑定表单字段(专辑名称等)后,在您的代码隐藏中,运行以下命令:

valName.ValidationExpression = string.Format("[^{0}]", Regex.Escape(lblName.Text));

上述正则表达式对任何输入都有效,除了开头的内容.如果用户更改了相册名称的文本,则保存按钮将正确验证.如果他们不这样做,验证器将启动并在页面上显示一条消息,说明他们必须更改它.

然后处理OnClick保存按钮的事件仅用于保存值,因为只有在页面被验证时它才会触发:

protected void btnSaveAs_Click(object sender, EventArgs e)
{
    if (Page.IsValid)
    {
        //do you save actions as needed
    }
}

您还可以按照自己的意愿使用确认框:

protected void Page_Load(object sender, EventArgs e)
{
    btnSave.OnClientClick = "return confirm('Are you sure you wish to change the name?');";
}

以上应该工作得很好.下面列出了另一种方法:

选项2:使用客户端验证功能

如果你想完全在客户端进行验证,你可以,但它会复杂得多.你需要做的是注册一个完全客户端验证功能.

在Page_PreRender期间的代码中:

protected void Page_PreRender(object sender, EventArgs e)
{
    //define the script
    string script = @"

    function validateAlbumName(oldName, textBoxId) {

        //get the textbox and its new name
        var newName = document.GetElementById(textBoxId).value;

        //compare the values 
        if (newName === oldName) {
            //if the name hasn't changed, 
            alert('You must change the name of the album');
            return false;
        }

        return confirm ('Are you sure you want to save the playlist ' + newName);  
    }

    ";

    //register the client script, so that it is available during the first page render
    Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "SaveAsValidation", script);

    //add the on client click event, which will validate the form fields on click the first time.
    btnSaveAs.OnClickClick = string.Format("return validateAlbumName('{0}','{1}');", txtAlbumName.Text, txtAlbumName.ClientID);

}

希望这可以帮助.上面可能有一些语法错误,因为我只是快速将它们拼凑在一起.