且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Oracle ApEx复选框用于在检查/取消选中时处理其他值

更新时间:2022-10-14 20:25:06

EMP表上的示例: / p>

  select 
apex_item.checkbox2(p_idx => 1,p_value => empno,p_attributes =>'class =check_select')empselection,
apex_item.text(2,ename)empname,
empno,
ename
from emp

向复选框项添加类。



创建一个新的动态动作,例如复选框点击。

事件:点击

选择类型:jQuery选择器

jQuery 选择器: .check_select (这是我们添加到sql中的复选框的类)

条件:JavaScript表达式

$(this.triggeringElement).prop('checked')



复选框元素,以查看它是否已选中或取消选中。 prop()测试元素的属性,并在这种情况下返回true或false。

True Action:

Action :执行JavaScript代码

代码 $(this.triggeringElement).closest(tr)。find(td [headers ='EMPNAME'] input)。val('test');

False Action: >
操作:执行JavaScript代码

代码 $(this.triggeringElement).closest ).find(td [headers ='EMPNAME'] input)。val('');



类型,因为我们需要定位与单击的复选框相同行中的项目。没有真正有办法通过顶点选择的可能性。通过标题定位列,不要忘记将输入定位到td(或: textarea !)



创建动态操作后,返回。在高级下,将事件范围更改为 Live 。这是必要的,以解决分页。



然后编辑true和false动作,并取消选中 页面加载时触发



现在考虑您的日期:

sysdate作为默认值,我建议为您的页面添加一个隐藏项,例如P9_DEF_DATE。作为,请使用 PLSQL表达式,然后使用 SYSDATE

使用该字段的值作为默认值,例如:

  $(this.triggeringElement).closest(tr) .find(td [headers ='EMPNAME'] input)。val($ v('P9_DEF_DATE')); 

最后一个注意:通过val清除一个值:use val ) SINGLE 报价!



$ b

动态动作文件的部分连结: b



ajax过程的示例:

所以让我们说,我想更新我检查的雇员的COMM列。



在报表页面上创建一个新进程,给它一个足够简单的名称,不要在其中放置空格。例如,我使用update_emp运行。

 更新emp 
set comm = apex_application.g_x02
where empno = apex_application.g_x01;

向动态操作添加另一个真实操作,输入执行JavaScript代码。

  $。post('wwv_flow.show',
{p_request:'APPLICATION_PROCESS = update_emp',
p_flow_id :$ v('pFlowId'),// app id
p_flow_step_id:$ v('pFlowStepId'),// page id
p_instance:$ v('pInstance' // session id
x01:$(this.triggeringElement).val(),
x02:'88',// just a bogus value to demonstrate
},
function(data){
/ *通常你会在这里处理返回值
一个例子是一个JSON返回值,用来设置项目值* /
}
);

这个javascript会发布到页面,定位 update_emp 过程。 x01 x02 是一种'temp'变量。它们存在,因此我们不必一直提交页面项目,以便将值发布到会话状态。它们是apex_application包的一部分。

这里我使用 x01 来存储empno(复选框的值,因此 this.triggeringElement )和 x02 以传递commision的值。我在这里硬编码,但你可以得到你想要的任何值。



$。post 是一个jQuery方法发布到页面。



当您学习动态动作或拖动论坛时,您可能会遇到另一种发布到页面的方法,即 htmldb_Get ,并且这是内置在尖端javascript文件。我不使用它,因为它不是真正的Ajax(异步),但Sjax(同步),并且不是透明的在我看来。我相信一些 GetAsync 部分,它是好的,所有,但你几乎看不到它用于任何例子。现在 get.get(); 看起来很容易,你可以在3行代码而不是我的js实现相同的结果,认为它是一个很好的实践真正的ajax调用。你可能会等待有时完成一个进程太多,并意识到所有这些 htmldb_Get 调用在你的应用程序不像你认为的那样有趣...

此报告设置也更复杂。有了页面项,你可以采取另一个路径:而不是执行一个javascript块,你可以执行一个plsql代码块。在那里你可以指定要提交到会话状态的项目(所以它们可以在plsql块中使用)和项目,以使它们的值由此plsql块设置。 (sql块运行服务器端,这意味着被引用的项目需要在会话状态中具有它们的值)。我会建议玩这个。

话虽如此,你也可以使用报表操作,但你需要设置一些虚假的项目,暂时保存的值,然后可以提交到会话状态。



基本上,有一个浏览器检查工具,如firebug打开。它允许您检查在页面上发出的ajax调用,并提供了一个很好的方法来查看这个。


Firstly, I am using the latest version of Oracle ApEx 4.1.1 and have the following standard report that has a checkbox selection so when clicked, would like to set another field with sysdate, including time.

When unchecked, would like to reset to NULL the date set in my previous statement as well as a comments fields

Report might look like:

select id,
       name,
       telephone,
       apex_item.checkbox2(10,id) as "Tick when Contacted",
       apex_item.display_and_save(20,:P2_DATE) as "Date Contacted",
       apex_item.textarea(30,:P2_COMMENT,5,80) as "Comment"
from   my_table

As an example of the above report, there might be a total of 10 records, so as each of the 10 record checkboxes are checked by the user, I would like to set the date field to sysdate, on the spot. I would also like the reverse done, when the checkbox is unchecked - set both date and comments to NULL.

Would appreciate any help with how to approach this and whether the above is possible via a Dynamic Action or straight via a javascript/on demand process.

Would definitely prefer the Dynamic Action approach if possible in order to learn new methods of performing my required task.

Thanks.

Example on EMP table:

select 
apex_item.checkbox2(p_idx => 1, p_value => empno, p_attributes => 'class="check_select"') empselection,
apex_item.text(2, ename) empname,
empno,
ename
from emp

Add a class to the checkbox item. This makes it easy to target with jQuery.

Create a new dynamic action, eg "checkbox click".
Event: Click
Selection Type: jQuery Selector
jQuery Selector: .check_select (this is the class we added to the checkbox in the sql)
Condition: JavaScript Expression
Value: $(this.triggeringElement).prop('checked')

The condition is a check on the checkbox element to see whether it has been checked or unchecked. prop() tests a property of an element, and returns true or false in this case. When true, a true action will fire, else a false action.

True Action:
Action: Execute JavaScript Code
Code: $(this.triggeringElement).closest("tr").find("td[headers='EMPNAME'] input").val('test');

False Action:
Action: Execute JavaScript Code
Code: $(this.triggeringElement).closest("tr").find("td[headers='EMPNAME'] input").val('');

Both have no selection types since we need to target items in the same row as that of the clicked checkbox. There isn't really a way to do this through the apex selection possibilities. Target the column through the headers, and don't forget to target the input inside of the td (or: the textarea!)

When the dynamic action has been created, go back in. Under Advanced change the Event Scope to Live. This is necessary to account for pagination. If you don't change this, no actions will be bound to elements after pagination.

Then edit the true and false action, and uncheck Fire on Page Load.

Now to account for your date:
Since you want the sysdate as a default value, i'd suggest to add a hidden item to your page, eg P9_DEF_DATE. As a source, use a PLSQL expression, and use SYSDATE.
You can then use the value of that field as a default value, eg:

$(this.triggeringElement).closest("tr").find("td[headers='EMPNAME'] input").val($v('P9_DEF_DATE'));

Last note: blanking out a value through val: use val('') with SINGLE quotes! Won't work with double in my experience.

Some links for Dynamic actions docs:

An example of an ajax process:
So let's say that i want to update the COMM column of the employee i checked.

Create a new process on the page of the report, give it an easy enough name and don't put spaces in it. For example, i'm running with "update_emp".

update emp
set comm = apex_application.g_x02
where empno = apex_application.g_x01;

Add another true action to the dynamic action, type "Execute JavaScript Code".

$.post('wwv_flow.show', 
       {"p_request"      : 'APPLICATION_PROCESS=update_emp',
        "p_flow_id"      : $v('pFlowId'), //app id
        "p_flow_step_id" : $v('pFlowStepId'), //page id
        "p_instance"     : $v('pInstance'), //session id
        "x01"            : $(this.triggeringElement).val(),
        "x02"            : '88', //just a bogus value to demonstrate
        },
        function(data){
           /*normally you'd handle the returned value here
             an example would be a JSON return with which to set item values*/
        }
        );

This javascript will post to the page, targetting the update_emp process. x01 and x02 are a sort of 'temp' variables. They exist so we don't have to submit page items all the time in order to post values to the session state. They are part of the apex_application package.
So here i'm using x01 to store the empno (value of the checkbox, hence this.triggeringElement), and x02 to pass in the value for the commision. I hardcoded it here but you can get any value you'd like of course.

$.post is a jQuery method posting to the page.

When you're learning dynamic actions or trawling forums, you may come across another method to post to the page, namely htmldb_Get, and this is built in in the apex javascript files. I don't use it because it is not true Ajax (asynchronous), but Sjax (synchronous), and is not transparant enough in my opinion. There is i believe some GetAsync part to it, which is good and all, but you'll barely ever see it used in any example. Now get.get(); may look easy, and you can achieve the same result in 3 lines of code instead of my piece of js, consider it a good practice to implement real ajax calls. You might the wait to finish a process too much at times, and realise all those htmldb_Get calls in your applications aren't as fun as you think they were...

Things are also more complicated with this report setup. With page items you can take another route: instead of executing a javascript block you can execute a plsql code block. There you can specify items to be submitted to session state (so they can be used in the plsql block) and items to have their value set by this plsql block. (sql blocks are run server side, which means referenced items need to have their values in session sate). I'd advice to play around with that aswell.
That being said, you could do this with the report actions too, but you'd need to set up some bogus items to temporarily hold values which can then be submitted to session state. Again, i'm no fan of that so i didn't went with that (another 'imo' thus).

Essentially, have a browser inspection tool such as firebug open. It allows you to inspect ajax calls made on pages, and provides a great way to look into this.