js コールバック メカニズムを使用して呼び出しページの部分更新を実装する

要件の説明: 処理が完了したら、承認フォーム ページが開かれ、同時に To Do フォームがリアルタイムで更新されるようにしたいと考えています。採用要件モジュールでの採用プロセスの開始など、特定のワークフロー管理モジュールから開始する必要性にも適用されます。

まず、前の実装を見てみましょう。このロジック実装の機能は、承認が完了した後、現在のページに直接ジャンプすることです。承認ページから新しいOAホームページに遷移し、My Work-My To-Doタブを開きます。 実装方法は以下の通りです:

$("#but_back").bind("click", function() { 
        window.top.opener=null; 
        var url = window.location.href; 
        var isoa=url.indexOf('phicomm.com'); 
        //var isoatest=url.indexOf('oatest.phicomm.com'); 
        var curWwwPath=window.document.location.href;  
        var pathName=window.document.location.pathname;  
        var pos=curWwwPath.indexOf(pathName);  
        var localhostPaht=curWwwPath.substring(0,pos);  
        var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); 
        if(isoa>0){ 
            window.top.open(localhostPaht+'/main/index.action?tableName=mywork','_self'); 
        }else{ 
            window.top.open(localhostPaht+projectName+'/main/index.action?tableName=mywork','_self'); 
        } 
    });

デスクトップjs処理ロジック:

$(document).ready(function($){ 
    // 初始化图标 
    initModules(initMenus()); 
      
    refixAppPos(); 
    // 注册事件 
    regClick(); 
      
    sortable(); 
   initIcoRemove(); 
      
    initAppManager(); 
    //解析当前URL判断是否需要跳转制定Table 
    gotoTable(); 
}); 
  
//跳转制定Table 
function gotoTable(){ 
    var tableName = request("tableName"); 
    if(""!=tableName&&null!=tableName&&'undefined'!=tableName){ 
        openUrl($("#desktop_content_icon_"+tableName)); 
    } 
}

上記の方法で機能を実現します。処理が完了した後に My To-Do にジャンプすると、次のような欠陥があります。

ジャンプは呼び出しページではなく新しいページに行われるため、呼び出しページとジャンプ ページの 2 つの同一のデスクトップが形成されます。ページが元の呼び出しページとまったく同じではない場合、複数のタブがある場合、新しく開いたページは、ユーザーのニーズを満たさない、My ToDo 以外の他のタブを閉じることと同じです。ユーザー エクスペリエンスはフレンドリーではありません

js コールバックの使用の実装は次のとおりです。現在のページ 呼び出し元のページが空でなく閉じられていない場合、部分的な更新を行うためにページ内の js メソッドを直接呼び出します。 。

/** 刷新父窗口关闭弹出窗口 */ 
    function refreshAndClose(){ 
        var jscallback = $.trim($("#jscallback").val()); 
        var type = $.trim($("#type").val()); 
        if (window.opener  && !window.opener.closed && jscallback!=null && jscallback!="") { 
            if(!type){ 
                //本页面的调用页面执行其嵌入或调用的js方法 
                eval("window.opener."+jscallback+"();"); 
            } 
            window.close();//当前页面关闭 
        } else { 
            window.top.opener=null; 
            var url = window.location.href; 
            var isoa=url.indexOf('phicomm.com'); 
              
            var curWwwPath=window.document.location.href;  
            var pathName=window.document.location.pathname;  
            var pos=curWwwPath.indexOf(pathName);  
            var localhostPaht=curWwwPath.substring(0,pos);  
            var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); 
            if(isoa>0){ 
                  
                window.top.open(localhostPaht+'/main/index.action?tableName=mywork','_self'); 
            }else{ 
                window.top.open(localhostPaht+projectName+'/main/index.action?tableName=mywork','_self'); 
            } 
        } 
    }

ページ js を呼び出します: グリッドは部分的に更新する必要があるテーブルです。

function openUrl(url){ 
    url=url+"&jscallback=callsus" 
         window.open(url,'_blank');    
} 
function callsus(){ 
    $('#performanceDataGrid').reload(); 
}

は、js コールバックを通じて呼び出しページの部分的な更新を実現し、他のアプリケーションの同様の関数に対する特定のガイダンスと参照の重要性を持ちます。

js コールバック メカニズムを使用して呼び出しページの部分更新を実現することに関するその他の関連記事については、PHP 中国語 Web サイトに注目してください。