3

我将ASP.NET 3.5与残暴的UpdatePanel、jQuery.delegate()和JavaScript对象文字结合使用。

我使用jQuery.delegate()持久化事件处理程序，这些事件处理程序确实在PostBack之后触发，正如预期的那样。

问题在于存储在对象字面量属性中的jQueryinit()对象，它们保留了在ASP.NET PostBack之前的值。

这是我的JavaScript：


SFAIC

SFAIC = 
{
    masterPages: { cs: "CS_", cp: "CP_" },
    contentPages: { cs: "CSContent_", cp: "CPContent_" },
    
    isSecurePage  : false,

    $body         : undefined,
    $container    : undefined,
    $updatePanel  : undefined,

    $textBox      : undefined,
    $errorLabel   : undefined
};

SFAIC.init()

SFAIC.init = function () 
{ 
    log( "--> SFAIC.init() fired" );

    var self = this; 

    self.$body        = $( "body" );
    self.$container   = self.$body.find( "#container" );
    self.$updatePanel = self.getCSMasterElement( "UpdatePanel1", self.$container );
    self.$textBox     = self.getContentElement( "TextBox1" );
    self.$errorLabel  = self.getContentElement( "ErrorLabel1" );
     
    self.$updatePanel.delegate( self.$textBox.selector, "blur", function () 
    { 
       self.validateRequired( self.$textBox, self.$errorLabel ); 
    });
    
    self.$textBox.focus();
};

SFAIC.validateRequired()

SFAIC.validateRequired = function ( $element, $errorLabel ) 
{
    if ( $element.val().length === 0 ) { $errorLabel.text( "Required" ); }
    else { $errorLabel.text( "" ); }
};

鉴于上述情况，whenSFAIC.init()被触发，self.textBox被分配给它的 jQuery 对象。我想这就是我的困惑。我认为当您调用 时.val()，它会立即返回该元素中的值。如果您调用服务器并更改控件的值，然后返回渲染元素的更改值，那么 jQuery 对象似乎不知道该更改？

我在这里错了吗？

我需要做些什么来保持对元素的实时引用，以便在页面回传后可以获得当前值？


每个@DaveLong 的编辑请求：


SFAIC.getCSMasterElement()

SFAIC.getCSMasterElement = function ( id, $context ) 
{ 
    return SFAIC.getElement( SFAIC.masterPages.cs, id, $context ); 
};

SFAIC.getCPMasterElement()

SFAIC.getCPMasterElement = function ( id, $context ) 
{ 
    return SFAIC.getElement( SFAIC.masterPages.cp, id, $context ); 
};

SFAIC.getContentElement()

SFAIC.getContentElement = function ( id, $context ) 
{ 
    return SFAIC.getElement
    ( 
        ( SFAIC.isSecurePage ) ? SFAIC.contentPages.cp : SFAIC.contentPages.cs, 
        id, 
        $context 
    ); 
};

SFAIC.getElement()

SFAIC.getElement = function ( page, id, $context ) 
{
    selector = SFAIC.getElementIdSelector( page, id );
    
    return ( selector ) 
        ? ( $context && $context.length ) 
            ? $context.find( selector ) 
            : SFAIC.$body.find( selector )
        : undefined;
};

SFAIC.getElementIdSelector()

SFAIC.getElementIdSelector = function ( page, id ) 
{ 
    var prefix = SFAIC.getElementPrefix( page );
    return ( prefix && id ) ? "#" + prefix + id : undefined;
};

SFAIC.getElementPrefix()

SFAIC.getElementPrefix = function ( page ) 
{   
    switch ( page ) 
    {
        case SFAIC.masterPages.cs : return SFAIC.masterPages.cs;
        case SFAIC.masterPages.cp : return SFAIC.masterPages.cp + SFAIC.masterPages.cs;
        case SFAIC.contentPages.cs : return SFAIC.masterPages.cs + SFAIC.contentPages.cs;
        case SFAIC.contentPages.cp : return SFAIC.masterPages.cp + SFAIC.masterPages.cs + SFAIC.contentPages.cs + SFAIC.contentPages.cp;                
    }
};
4

3 回答 3

4

UpdatePanel 从 DOM 中删除整个目标，并用响应中的新标记替换它。不是您的 var 保存旧值，而是它们保存对原始标记的引用。您需要“重新初始化”以获得对 DOM 中新节点的引用。

于 2011-06-12T19:01:23.237 回答
1

当 ajax updatepanel 请求完成时，也许您应该重新初始化对象

<script type="text/javascript" language="javascript">
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(ReInitiate); 
     function ReInitiate(sender, args)
     {
        //re-initialize the objects 
        //add code here 
     } 
</script>

干杯，尼丁

于 2011-06-08T09:32:30.527 回答
0

对于它的价值，我想出的解决方案是 Paul Irish 的基于标记的不显眼的全面 DOM 就绪执行和@NitinJS'/@Ethan 的答案的定制版本。


在我的 JavaScript 底部，我添加了：

UTIL = {

    fire : function(func, funcname) {

        var namespace = SFAIC;
        funcname = (funcname === undefined) ? "init" : funcname;

        if (func !== "" && 
            namespace[func] && 
            typeof namespace[func][funcname] == "function") { 

            namespace[func][funcname](); 

        }

    },

    loadEvents : function() {

        var bodyId = document.body.id;

        UTIL.fire("common");
        UTIL.fire(bodyId);

    }

};

// Fire events on initial page load.
UTIL.loadEvents();

// Fire events for partial postbacks.
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(UTIL.loadEvents);


在我的 MasterPage 的 aspx 中，我将 body 标记修改为：

<body id="<%=bodyId%>">


在我的 MasterPage 的代码隐藏声明中，我添加了：

Public bodyId As String = String.Empty


在我的 MasterPage 的代码隐藏 Page.PreRender 处理程序中，我添加了：

bodyId = MyBase.GetType.BaseType.Name
于 2011-06-22T22:16:47.700 回答