1

我有两份报告。单击主报告中的列链接会在辅助报告中显示有关它的详细信息,然后单击该链接会刷新页面(也许如果仅使用 AJAX 刷新第二个报告我不会遇到以下问题,但我认为这将更难实施和维护)。

我有一个这样的javascript函数来突出显示该行:

function highlight(pThis) {
    $x_RowHighlight($x_UpTill(pThis,'TR'), 'pink');
}

但是当页面刷新时,该行当然不会保持突出显示。如果可能的话,我很想保持 pThis 的会话状态。

我还需要在辅助报告中放置一个下一步按钮,该按钮将显示主报告中下一行的详细信息,并突出显示该行。

有什么建议么?

4

3 回答 3

2

我整理了一个包含所有代码的示例页面:http ://apex.oracle.com/pls/apex/f?p=54687:39

因为我想说明一个列链接,所以我已经让它更多地参与了。单击链接时,该行也必须突出显示。请注意,只有当您保持在同一页面上(或者更确切地说,只要您在同一 IR 页面上),它才会像这样工作。我现在什至注意到,当您导航到页面并重置分页时,它会保持该行的颜色 - 哦,这是一个很好的跳转点。

我使用 rowindex 有一个很好的理由:IR 的好的解决方案并不真正存在,并且总是非常自定义编码。您实际上需要一个值(或多个值)来唯一标识行。这会带来一些问题,因为例如隐藏列不会在 HTML 中呈现。如果它在列中,则很可能用户可以隐藏或以某种方式从 html 中删除该列(不要显示它,应用分组,...)。


在查看 Matthew 自己的答案后,我编辑了我的示例应用程序页面以包含一种处理经典报告的方法。我会试着把它分开一点。
1)我不会通过减小宽度来“隐藏”我的列。只需使用列属性隐藏您的列并将类型更改为隐藏。
2)你并不真的需要一个列项目,除非你真的要记住这一点。但是我真的看不出它的意义,除非你允许点击整行(就像我在我的 IR 示例中所做的那样,但我对经典报告不屑一顾)
3) (a+b+c) 我完全做到了不同的。我认为将类分配给行元素是一种更好的方法,因为这样可以更好地进行操作和遍历。该$x_RowHighlight函数将style属性添加到td元素,我不喜欢那样。通过类和 CSS 控制样式更加通用。
我还认为这里不需要 AJAX!单击链接时,您可以直接设置项目值,而无需通过 ajax 调用。我还认为这不需要是同步调用(默认情况下 htmldb_Get 是),但可以是异步的,以免浏览器等待返回(没有)。
不过,如果您想像我的 IR 示例中那样设置它,则可能需要 ajax,以便单击行上的任意位置会选择该行。
至于选择下一行:在我的示例中,您需要将输入项的更改替换为单击链接列 - 应该不难!


使用 htmldb_Get 执行异步调用:

var ajaxRequest = new htmldb_Get(null, $v("pFlowId"), "APPLICATION_PROCESS=some_process", $v("pFlowStepId"));
ajaxRequest.addParam("x01","some value"); -- adds a parameter to the request, good for the x## variables
ajaxRequest.add("P1_EMPNO", "some value"); -- adds the key-value to p_args_names en values: page items!
ajaxRequest.getAsync(function(pResponse){
   if(pResponse.readyState==4&&pResponse.status==200){
      //call finished successfully
      console.log(pResponse.responseText);
   };
});
于 2013-01-14T14:35:48.040 回答
1

行。在汤姆发布他的之前,我找到了解决方案。他对 JQuery index() 函数的使用非常棒;我希望我事先知道这件事。另一方面,就像汤姆提到的那样,在分页的情况下, index() 将很难或不可能使用。接下来是The ROWID Column Method

我将把它分成 2 个答案,一个用于经典报告,一个用于 IR 报告。

以下是针对 CR 的。

1)添加一个rowid作为SQL查询的第一列,并将其别名设置为“”。在经典报表中,将列宽设置为 1,并在列格式下,在 CSS 样式中,放置display:none;.

2a) 将以下隐藏项添加到您的页面:PX_CURRENT_ROW, PX_CURRENT_COLUMN。2b)如果您想要下一个和上一个按钮,并将以下按钮添加到您的页面:NEXT, PREVIOUS

3)a 在页面设置中,在 JavaScript 下,在页面加载时执行,添加以下内容:

bind_validations(); //Tom will note whom I have learned my APEX/JQ tactics from :)
highlight();

3b) 在页面设置中,在 JavaScript 下,在函数和变量声明中,为三个函数添加以下代码:标识、突出显示和 bind_validations。我们将从绑定验证开始,它会在单击列链接时将列的 TD 发送到 identify_row 函数。我正在使用一个 PLSQL 函数为我的报告返回一个 SQL 查询,因此由 JQuery 标识的所有列标题都是通用的 COL0x。如果您使用常规查询,请在列标题中使用数组。

function bind_validations() {
    var columnHeader = 'COL0';
    for (var i = 2; i <10; i++) {
        columnHeader = 'COL0' + i;
        $("td[headers='" + columnHeader + "']").find('a').each(function(){
            $(this).click(function(){
                if ($(this).text.length != 0) { //necessary for next/previous buttons 
                    identification(this);
                    window.location.href=this.href; //necessary for next/previous buttons
                }
            });
        });
    }
}

3b) 现在是识别功能。这会在页面加载之前暂时突出显示该行(延迟效果很好,因为它让用户知道该行将被激活),使用 $x_UpTill 对通过前一个函数中绑定的链接传递给函数的 TD 进行。

function identification(pThis) {
    var currentColumn = $x_UpTill(pThis, 'TD');
    var currentColumnHeader = $(currentColumn).attr('headers');
    var currentRow = $x_UpTill(pThis,'TR');
    var currentRownum = $(currentRow).find("td[headers='COL01']").text(); 
    $x_RowHighlight(currentRow, 'pink');

    //AJAX
    /* As Tom mentions, AJAX is unnecessary: use f?p via column links instead. 
    In my particular situation, the idiosyncrasies render the passing of values
    through f?p inappropriate. The purpose of passing the column header is for
    the previous/next buttons, which will activate blank columns otherwise if 
    everyone of your columns has a link on it.
    */
    var get = new htmldb_Get(null, &APP_ID., 'APPLICATION_PROCESS=dummy', &APP_PAGE_ID.);
    get.add('PX_CURRENT_COLUMN' , currentColumnHeader);
    get.add('PX_CURRENT_ROW', currentRownum);
    gReturn = get.get();
    get = null;
}

3)c 这里是高亮功能:

function highlight() {
    var currentRownum = $v('PX_CURRENT_ROW')
    $("tr").each(function() {
        var rownum = $(this).find("td[headers='COL01']").text(); //Use ' ' if you don't have generic columns like I do
        if (parseInt(rownum) == parseInt(currentRownum)) $x_RowHighlight(this, 'red');
    });
}

4) 现在在下一个和上一个按钮上添加动态操作。对于 NEXT 按钮,执行动态操作:执行 JavaScript 代码,不要在页面加载时触发:

var currentRownum = $v('PX_CURRENT_ROW');
var currentColumnHeader = $v('PX_CURRENT_COLUMN');
$("tr").each(function() {
    var nextRownum = $(this).find("td[headers='COL01']").text();
    if (parseInt(nextRownum) == parseInt(currentRownum) + 1) { //use -1 for the previous button
        $(this).find("td[headers='" + currentColHeader + "']").find('a').trigger('click');
    }
});

对于上一个按钮,将条件更改为:`if (parseInt(nextRownum) == parseInt(currentRownum) - 1)

于 2013-01-24T00:38:01.107 回答
0

您可以通过使用 cookie 来实现这一点吗?我使用了我发现非常有用的jquery cookie 插件。

我对 oracle-apex 一无所知,但下面是一个可能有效的基本 javascript/jquery 解决方案,

    $("tr").click(function (){ 
        var activeTR = function (){ 
            $(this).addClass('.active');
            $.cookie("activeTR","activated",({ expires:7, path: '/' }));
        };
    });

    if ($.cookie("activeTR") == "activated"){activeTR()}

基本上将一个类添加到单击的 tr,然后添加一个 cookie 来说明哪个是单击的 tr,然后当页面加载时,它将该类重新应用到单击的 tr。

请注意,我还没有尝试过,所以它不会起作用,但这是一个让你开始的想法。

于 2013-01-10T18:59:57.737 回答