部分页面回发后,在UpdatePanel中选择ASP.NET TextBox的内容

时间:2010-05-19 21:45:56

标签: asp.net javascript updatepanel

我在IE 8的UpdatePanel中选择TextBox中的文本时遇到问题。考虑一个包含单个UpdatePanel的非常简单的页面。在该UpdatePanel中有两个Web控件:

  1. 一个DropDownList,包含三个静态定义的列表项,其AutoPostBack属性设置为True,
  2. TextBox Web控件
  3. DropDownList为其SelectedIndexChanged事件提供了服务器端事件处理程序,在该事件处理程序中有两行代码:

    TextBox1.Text = "Whatever";
    ScriptManager.RegisterStartupScript(this, 
                          this.GetType(), 
                          "Select-" + TextBox1.ClientID,
                          string.Format("document.getElementById('{0}').select();", 
                                                           TextBox1.ClientID), 
                          true);
    

    这个想法是,无论何时用户从DropDownList中选择项目,都会有部分页面回发,此时将设置并选择TextBox的Text属性(通过注入的JavaScript)。不幸的是,这不能正常工作。 (我也尝试将脚本放在pageLoad函数中,没有运气,如: ScriptManager.RegisterStartupScript(...,“function pageLoad(){... my script .. 。}“); )代码运行会发生什么,但页面上的其他内容会在部分页面回发结束时获得焦点,从而导致TextBox的文本被取消选择。

    我可以通过使用JavaScript的setTimeout来“修复”这个,以延迟我的JavaScript代码的执行。例如,如果我将发出的JavaScript更新为以下内容:

    setTimeout("document.getElementById('{0}').select();", 111);
    

    它“有效”。我把作品放在引号中,因为它适用于我电脑上的这个简单页面。在较慢的计算机上的一个更复杂的页面上,在部分页面回发的客户端和服务器之间传递更多标记,我必须将超时超过一秒才能使其工作。我希望有一种更加万无一失的方法来实现这一目标。而不是说“延迟X毫秒”,理想的说法是,“当你不想偷走焦点时运行它。”

    令人困惑的是.Focus()方法运行得很漂亮。也就是说,如果我废弃我的JavaScript并将其替换为对 TextBox1.Focus(); 的调用,则TextBox会获得焦点(尽管未选中该文本)。我已经检查了 MicrosoftAjaxWebForms.js 的内容,看到焦点是在注册的脚本运行后设置的,但是我的JavaScript技能不够强大,无法解码这里发生的一切以及为什么在所选文本的选择时间和部分页面回发结束之间取消选择所选文本。我也尝试过使用Firebug的JavaScript调试器,看看当我的脚本运行时,TextBox的文本被选中了。当我继续单步执行它时,文本仍然被选中,但是在踩下最后一行脚本(显然)之后,它突然被取消选择了。

    有什么想法吗?我把头发拉了出来。

    提前致谢...

    编辑:经过进一步测试后,我注意到此行为仅发生在IE 8中。在Firefox,Chrome或Safari中进行测试时,会发生... < / p>

2 个答案:

答案 0 :(得分:3)

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
        function(sender, args) {
            document.getElementById('TextBox1.ClientID').focus();
        });

一旦UpdatePanel完成了它的请求,就会调用它。您还需要从DOM中重新提取元素,因为在调用更新面板之前对它的任何引用都不会指向更新面板完成后的字段。

答案 1 :(得分:2)

我没有太多使用UpdatePanel,因此不了解这是否在您的具体情况下有用,但是使用jQuery document.ready wrapper成功解决了焦点问题。如果您还没有使用jQuery,那么可能值得进行测试 - 尝试更改RegisterStartupScript以输出如下内容:

$(document).ready(function() {
    document.getElementById('TextBox1.ClientID').select();
});

当然可能有非jQuery方法对此进行排序,但这种方法通常很简单。