On Page Load I need to set a value of page item P1_ITEM2 based on the value of the application item APP_ITEM1
I created the following DA on page load:
Action: SetValue
Set Type: PL/SQL Expression
PL/SQL Expression: package1.my_function(:APP_ITEM1)
Items to submit: APP_ITEM1
Affected Elements
Selection type: Items
Items: P1_ITEM2
Nothing gets set. Not sure what is going on
Create an After Header Computation for the page item.(In your case P1_ITEM2)
Select the Type as Function Body and paste your function call (In your case package1.my_function(:APP_ITEM1))
Related
I am new to developing application using oracle apex. Please excuse me if this question seems very trivial in nature.
In a nutshell, I am trying to invoke a REST service programmatically to populate an interactive grid on oracle apex page. Here's what I already tried.
Created a page that has a button to invoke a process.
The process invokes a REST service to get all order lines belonging to a particular order. The sample response from the REST service is as below
{
"items": [{
"HeaderId": 300100550016803,
"FulfillLineId": 300100550016806,
"SourceTransactionLineId": "1",
"SourceTransactionLineNumber": "1",
"OrderedQuantity": "10",
"OrderedUOM": "Each",
"RequestedFulfillmentOrg": "Vision Corporation"
},{
"HeaderId": 300100550016803,
"FulfillLineId": 300100550016807,
"SourceTransactionLineId": "2",
"SourceTransactionLineNumber": "2",
"OrderedQuantity": "15",
"OrderedUOM": "Each",
"RequestedFulfillmentOrg": "Seattle Manufacturing"
}]
}
If the rest service invocation was successful (http status code: 200), then I create the apex_collection as below in the same process. Also, I have set one of the page fields (P3_REFRESH_ORDER_LINES_GRID) to ‘Y'. On page load, the value for this attribute must be null.
if apex_web_service.g_status_code = 200 then --OK
dbms_output.put_line( 'Response : ' || l_data ); --if response was OK, print it
apex_collection.create_or_truncate_collection( 'OrderLines' );
apex_collection.add_member(
p_collection_name => 'OrderLines',
p_clob001 => l_data );
:P3_REFRESH_ORDER_LINES_GRID := 'Y';
end if;
I have then used the below SQL query to populate data into the interactive grid
Set the region type to “Interactive Grid”
Source: Local Database
Type: SQL query
SELECT ol.fulfill_line_id as FulfillLineId, ol.quantity as Quantity
FROM APEX_collections c,
JSON_TABLE(
c.clob001, -- the following lines depend on your JSON structure
'$.items[*]'
columns(
fulfill_line_id number path '$.FulfillLineId',
quantity number path '$.OrderedQuantity')
) ol
WHERE c.collection_name = 'OrderLines';
Then, I have setup a dynamic action on the page item (Its a hidden text field)
- P3_REFRESH_ORDER_LINES_GRID
- Dynamic Action name : RefreshGrid
- When: Event Name: Change
- selection type: Item
- Item - P3_REFRESH_ORDER_LINES_GRID
- Client side condition - Type: Item is not null
- Item - P3_REFRESH_ORDER_LINES_GRID
- True condition: Action: Refresh, selection type: Region, Region: Order Lines (Name of the region containing the IG)
After I click on the button to invoke the rest service to fetch the order lines, the interactive grid does not display any data. Can you suggest where am I going wrong here?
Potential Issue(s)
Step 1 You didn't really specify how your button works. If it is submitting the page, you may have problems with P3_REFRESH_ORDER_LINES_GRID field remaining null.
You could have Server-Side conditions preventing the invocation or on Page-Load you may be resetting P3_REFRESH_ORDER_LINES_GRID to null, and Step 5 will NOT trigger.
Step 3(Most Likely Issue) If you are not submitting the page, and you just have a Dynamic Action, executing Server-Side code: you may have forgotten to include P3_REFRESH_ORDER_LINES_GRID in the Items to Return.
Your P3_REFRESH_ORDER_LINES_GRID flag will remain null and Step 5 will NOT trigger.
To Debug
You can try debugging your page here by checking Session under Developer Tools. I would make sure each step work and executes however I intend it to execute.
Also leverage APEX_DEBUG in my PL/SQL
Open your Browser's Developer Tools and look under Console. You should see Dynamic Action Fired lines there if Step 5 is being triggered at all!
As you have not shared how your debugging went, and other observations after clicking the button, such as:
Was the collection created?
Is there data in the collection?
What's the value of P3_REFRESH_ORDER_LINES_GRID
You should be able to see what the answers are for the above using Session.
I'm running Apex 19.2
I have a page with some items created dynamically as follows :
HTML clob;
Html := APEX_ITEM.textarea(p_idx=>32, p_value=>'MyValue',p_item_id=>'MyId',p_attributes=>'class="textarea"');
htp.p(HTML);
The page items are generated correctly :
<textarea name="f32" rows="4" cols="40" wrap="VIRTUAL" class="textarea" id="MyId"></textarea>
I'm also adding the item wrapper to match the static Items layout created from the designer.
<div class="t-Form-inputContainer col">
<div class="t-Form-itemWrapper">
<textarea name="f32" rows="4" cols="40" wrap="VIRTUAL" class="textarea" id="MyId"></textarea>
</div>
<span id="MyId_error_placeholder" class="a-Form-error"></span>
</div>
In the validation, I'm checking some rules from apex_application.g_fn arrays and I would like to show an error on the item created via :
apex_error.add_error(p_message => 'error', p_display_location => apex_error.c_inline_with_field_and_notif, p_page_item_name=> 'MyId');
After validation, the error is not shown next to the item created. Notification also appears but it's empty. However If I try to show the same error on a static item created in the designer. The error is shown properly.
Can anyone help please ?
Thanks.
As you've found, APEX_ITEM doesn't work with APEX_ERROR in the way that you'd like it to. Marc's comments here indicate that APEX_ITEM will likely not be developed further, so it probably never will. https://stackoverflow.com/a/61737128/3010084
Your best option might be to move your validation logic to a stored procedure. Do all the validation in one call via parameters. In addition to the regular parameters, add a parameter that indicates if the response should be JSON or not. If so, just return a JSON document with the errors, otherwise use apex_error. This will allow you to call the validation logic via Ajax to show the errors where you like, but also on submit/page processing (because client-side validation can't be trusted).
Here are some steps you can follow to see how this works... First, compile the following procedure in your schema:
create or replace procedure validate_thing(
p_description in varchar2,
p_return_json in boolean,
p_json_result out json_object_t
)
is
l_errors_arr json_array_t := json_array_t();
l_error_obj json_object_t := json_object_t();
l_item_id varchar2(30);
l_error_message varchar2(255);
begin
if length(p_description) > 10
then
l_item_id := 'description';
l_error_message := 'Description should be less than 10 characters.';
if p_return_json
then
l_error_obj := json_object_t();
l_error_obj.put('pageItem', l_item_id);
l_error_obj.put('message', l_error_message);
l_errors_arr.append(l_error_obj);
else
-- Server-side code will not worry about displaying the error with the item as
-- this is just a backup for the client-side validation
apex_error.add_error(
p_message => l_error_message,
p_display_location => apex_error.c_inline_in_notification
);
end if;
end if;
if p_return_json
then
p_json_result := json_object_t();
if l_errors_arr.get_size() > 0
then
p_json_result.put('status', 'error');
p_json_result.put('errors', l_errors_arr);
else
p_json_result.put('status', 'success');
end if;
end if;
end;
As you can see, the procedure has logic to do client-side validations (JSON) or server-side validation (APEX_ERROR). You would need to add additional parameters and logic as needed for the form.
Create a new blank page in your app and go to the Page Designer for the new page. Right-click Content Body (under Regions) and select Create Region. Set the region's Type to PL/SQL Dynamic Content and add the following code to the PL/SQL Code attribute:
declare
html clob;
begin
-- The div and fieldset wrappers are needed so that APEX will generate an error
-- message template automatically to display the error inline.
html := '<div><fieldset>';
html := html || APEX_ITEM.textarea(p_idx=>32, p_value=>'MyValue',p_item_id=>'description',p_attributes=>'class="textarea apex-item-textarea"');
html := html || '</fieldset></div>';
htp.p(html);
end;
That code uses apex_item to add an item to the page dynamically. Note, the value passed to p_item_id, as that's important. The apex-item-textarea class is needed for error styling and the div and fieldset wrappers are needed to display error messages inline.
Select the Processing tab in Page Designer. Right-click Ajax Callback and select Create Process. Set Name to DO_VALIDATIONS and enter the following code in the PL/SQL Code field.
declare
l_result json_object_t;
begin
validate_thing(
p_description => apex_application.g_x01,
p_return_json => true,
p_json_result => l_result
);
htp.p(l_result.to_string());
end;
That is the code that will call validate_thing with p_return_json set to true. Note that the value of "description" is being passed in via apex_application.g_x01. You have g_x01 - g_x20 to work within this way. There are various options you could leverage to sent values in via Ajax, this is just one example. See see the doc on apex.server.process (used next) for more info.
Return to the rendering tab, right-click the new region, and select Create Button. Set the Button Name to SUBMIT. Right-click the SUBMIT button and select Create Dynamic Action. Set the Name to SUBMIT clicked. Select the default Show action, set its Action to Execute JavaScript Code, then add the following code to the Code field:
apex.server.process(
'DO_VALIDATIONS',
{
x01: $x('description').value
},
{
success: function(result) {
apex.message.clearErrors();
if (result.status === 'error') {
for (var idx = 0; idx < result.errors.length; idx++) {
result.errors[idx].type = 'error';
result.errors[idx].location = ['page', 'inline'];
result.errors[idx].unsafe = false;
}
apex.message.showErrors(result.errors);
} else if (result.status === 'success') {
apex.page.submit('SUBMIT');
}
},
error: function( jqXHR, textStatus, errorThrown ) {
console.log(jqXHR, textStatus, errorThrown)
}
}
);
This is the JavaScript code that will invoke the new DO_VALIDATIONS Ajax process. If errors are returned from the server, apex.message.showErrors will display them. Otherwise, the page is submitted for processing.
Select the Processing tab, right-click Processing, and select Create Process. Set Name to Do Validations and enter the following code in the PL/SQL Code attribute:
declare
-- Only needed to call validate_thing, not used.
l_result json_object_t;
begin
validate_thing(
p_description => apex_application.g_f32(1), -- This is where the item's value will be when submitting normally
p_return_json => false, -- This tells validate_thing to use apex_error
p_json_result => l_result
);
end;
That code will invoke validate_thing with p_return_json set to false. This will rerun the validations on the server-side to ensure they are enforced there. As it's just a backup for the client-side call, I don't worry about displaying errors inline with the items (the JS will do that).
Right-click Processing again and select Create Process. Set Name to Do Work and just enter null; for the PL/SQL Code Attribute. Set Success Message to It ran.. Under Server-side Condition, set Type to PL/SQL Expression and enter not apex_error.have_errors_occurred in the PL/SQL Expression field.
This process represents the actual business logic you want to run after validations have passed. You will only see the success message after clicking submit if both the Ajax and server-side validations have passed.
If you wish the test the server-side validations, add this line of JavaScript code in the Dynamic Action, just before the line that submits the page:
$x('description').value = '12345678910';
That will update the value of the text area to exceed the limit enforced by the server.
I'm trying to bind an "Execute PL/SQL Code" to a button using Dynamic Actions then open a page using the new ID (execid)
begin
insert into SMIG_EXECUTION(EXECNAME, CALL, STEPID, DURATIONMIN)
values('bla bla',REPLACE(:P31_CALLTEMPLATE,'#STEPID#',to_char(:P31_STEPID)), :P31_STEPID, 0)
returning execid into :P31_NEWEXECID ;
end;
The PL/SQL code is working, but I can't shake the link to opening the new page as a Dynamic Action and passing that new value as P2_EXECID.
You can accomplish this by using window.open() (javascript function)
open() method opens a new browser window.
Add TRUE ACTION to your existing Dynamic Action
Choose EXECUTE JAVASCRIPT CODE for your Action
Then paste this code:
window.open('f?p='+$v('pFlowId')+':'+$v('pFlowStepId')+':'+$v('pFlowInstance')+'::::<page item here>:<value of the item to be passed>:','_self');
Note:
$v('pFlowId') => APPLICATION ID
$v('pFlowStepId') => PAGE NUMBER
$v('pFlowInstance') => SESSION ID
If multiple items/values needs to be passed, you can do that by listing the items/values with a comma as a delimeter
i.e. 'f?p=.....:P2_ITEM1,P2_ITEM2,P2_ITEM3:1,2,3:';
EDIT: added second parameter
I'm writing RoR application and I have working autocomplete. In page.coffee I have this:
jQuery ->
$('#search').autocomplete
source: "/autocomplete_source"
In the form I have also #select combobox in addition to the #search textbox and I'd need to pass the value of selected item as 'data' into the jQuery.autocomplete method.
In short - I need to restrict searched values by the value of combobox selected item.
How can I pass it?
Thanks
This should do the trick:
jQuery ->
$('#search').autocomplete
source: '/autocomplete_source',
data: {}
And if you want a compltex data object, you can do this:
jQuery ->
$('#search').autocomplete
source: '/autocomplete_source',
data:
key: 'value',
key2: 'value'
I am on APEX 3.2 and in a form used to insert fields f1 and f2 in table f, I would like to have a couple of text items that will automatically populate and display based on the data typed in f1 and from a query on table t. In other word, typing empno in f1, moving to the f2 box the user should automaticcaly see emp last_name and first_name displayed. This way she can verify the empno typed was correct, type other data in f2 and submit the form.
Any suggestion on how to reach this scope?
I guess I should use some javascript.
Many thanks.
Gabriele
I can see that you may already be going down the javascript road... I have worked with APEX 3.2 in the past on a similar problem and didn't know enough javascript to get this kind of dynamic functionality out of the platform. If you want to try an alternate method, you can tweak your user interface to provide the functionality you seek, but you'll have to check with the users if they can adapt to this style of approach, which you should be able to do using existing 3.2 functionality and no additional scripting:
Requirements:
Based on field inputs of field1 and field2, auto-populate an apex page with data from an existing table so that the user can confirm if the data inputted in field1 and field2 are correct. Use the data from the search results as parameters for input to a new process or form.
Suggested Design:
Page 1: start with blank page, then add three items: field1, field2 and a "submit" button.
add page process (after submit, conditional on submit button item) that redirects to Page 2 setting items P2_field1 and P2_field2 from the values on the Page 1 form.
Page 2: report page. set a query that will search your table of existing employees searching by partial or full string searches against the employee table. APEX 3.2 used to use the following convention to get around partial and case sensitive matching issues:
SELECT field1, field2, field3, field4, ...
FROM table1
WHERE instr(upper(field1), upper(:P2_field1), 1, 1) > 0
AND instr(upper(field2), upper(:P2_field2), 1, 1) > 0
Creating a report output "table" for a search effort helps when there may be multiple answers to the same search query... such as with common names like "Smith" or "John"...
Add an additional column to the report output or make the name column (field1 or field2) a linked column that goes to page 3 feeding the queried data from the employee table.
add the property to the column value on the report editor: redirect to "page 3", set P3_key = #KEY# where page 3 is your final target form or process and "key" is the index or primary key of the table you are searching from... or you can feed the n number of values needed already queried from the lookup table to populate the page 2 report.
I guess the important take-home is an appreciation for the limitations of older versions of Apex along with possible limitations with knowledge of advanced web scripting languages. Your requirements are still achievable even if all you are familiar with is the basics of your Apex version and a little SQL.
note: if your lookup table is HUGE (hundreds of thousands of records), you may need to consult your DBA for help with optimizing the table to handle the SQL search query. Adding UPPER and INSTR functions to the WHERE criteria isn't really the most efficient way to query large datasets without additional help in optimization.
I'm not a 3.2 wiz, i haven't worked with it. I do know there are no dynamic actions and no page on-demand process points, so i've worked with that in mind.
Application process: 'get_emp_details'
(I don't know the processing point you can/need to choose in 3.2. If you can pick on-demand, go for it.)
Code:
DECLARE
lEmp emp%rowtype;
BEGIN
SELECT *
INTO lEmp
FROM emp
WHERE empno = :P7_EMPNO;
htp.p('{"result":"ok", "emp":{"ename":"'||lEmp.ename||'","job":"'||lEmp.job||'"}}');
EXCEPTION
WHEN no_data_found THEN
htp.p('{"result":"nok", "emp":{}}');
END;
On your page (in my case i have used page 7, change the page numbers to your page number!) put this in the html headers section (or if you have the javascript section there, put the javascript code there without the script tags):
Edit: added in console.log lines. Mind that these will produce javascript errors in IE when the developer tools (F12) are not opened!
<script type="text/javascript">
$(document).ready(function(){
console.log('document is ready');
$("#P7_EMPNO").change(function(){
var oDBGet = new htmldb_Get(null, $('pFlowId').val(), "APPLICATION_PROCESS=get_emp_details", '0');
oDBGet.add('P7_EMPNO', $("#P7_EMPNO").val());
var oResult = oDBGet.get();
var lReturn = $.parseJSON(oResult);
if(lReturn.result=='ok'){
var lEmp = lReturn.emp;
$("#P7_ENAME").val(lEmp.ename);
} else {
alert('ename could not be found for this empno!');
};
});
});
</script>
This will do an ajax callback when the EMPNO changes, and change the ename of the employee. Since there are no temporary application items that can be used (apex_application.g_x##) i'm submitting the required page item to session state. In this case P7_EMPNO is added to the p_arg_names array and its value in the corresponding position in the p_arg_values array. This is necessary because the session state of P7_EMPNO is used in the application process.
When inspecting the console tab in Firebug:
Post values of ajax call:
Response values of ajax call:
Tom,
here is your code modified to work in my system:
-- On Demand Application Process get_emp_details:
DECLARE
lEmp emp%rowtype;
BEGIN
SELECT *
INTO lEmp
FROM emp
WHERE badge = :P2_BADGE;
htp.p('{"result":"ok", "emp":{"lastname":"'||lEmp.last_name||'","firstname":"'||lEmp.first_name||'"}}');
EXCEPTION
WHEN no_data_found THEN
htp.p('{"result":"nok", "emp":{}}');
END;
-- Javascript in page header:
<script type="text/javascript">
$(document).ready(function(){
$("#P2_BADGE").change(function(){
$.post('wwv_flow.show',
{"p_request" : "APPLICATION_PROCESS=get_emp_details",
"p_flow_id" : $v('pFlowId'),
"p_flow_step_id" : '0',
"p_instance" : $v('pInstance'),
"p_arg_names" : ['P2_BADGE'],
"p_arg_values" : [$('#P2_BADGE').val()]},
function(data){
if(data){
var lReturn = $.parseJSON(data);
if(lReturn.result=='ok'){
var lEmp = lReturn.emp;
$("#P2_LAST_NAME").val(lEmp.last_name);
} else {
alert('ename could not be found for this empno!');
};
};
}
);
});
});
</script>
I am probably missing something and it doesn't display last_name in P2_LAST_NAME when I type the badge number in P2_BADGE.
Thanks,
Gabriele
Tom, here is what I have in the watch right window of firebug for the function(data) step:
this
function()
arguments
[
"wwv_flow.show"
, Object { p_request=
"APPLICATION_PROCESS=get_emp_details"
, p_flow_id=
"120"
, p_flow_step_id=
"0"
, more...}, function()]
0
"wwv_flow.show"
1
Object { p_request=
"APPLICATION_PROCESS=get_emp_details"
, p_flow_id=
"120"
, p_flow_step_id=
"0"
, more...}
p_arg_names
[
"P2_BADGE"
]
p_arg_values
[
"155752"
]
p_flow_id
"120"
p_flow_step_id
"0"
p_instance
"2189517750670012"
p_request
"APPLICATION_PROCESS=get_emp_details"
2
function()
e
"wwv_flow.show"
r
Object { p_request=
"APPLICATION_PROCESS=get_emp_details"
, p_flow_id=
"120"
, p_flow_step_id=
"0"
, more...}
p_arg_names
[
"P2_BADGE"
]
p_arg_values
[
"155752"
]
p_flow_id
"120"
p_flow_step_id
"0"
p_instance
"2189517750670012"
p_request
"APPLICATION_PROCESS=get_emp_details"
s
undefined
i
function()
toString
function()
Closure Scope
Closure Scope { toString=function()}
Closure Scope
Closure Scope { toString=function()}
Window
Window f?p=120:2:2189517750670012::NO:::
From my firebug 1.10.6 console:
document is ready
f?p=12...::NO::: (line 29)
empno has changed
f?p=12...::NO::: (line 31)
performing a post with empno value: undefined
f?p=12...::NO::: (line 32)
POST
400 Bad Request
48ms
wwv_fl....min.js (line 2)
HeadersPostResponseHTMLCookies
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<HTML><HEAD>
<TITLE>400 Bad Request</TITLE>
</HEAD><BODY><H1>Bad Request</H1>
The HTTP client sent a request that this server could not understand.</BODY></HTML>
-- And the post tab:
Parametersapplication/x-www-form-urlencoded
p_arg_names[] P2_BADGE
p_arg_values[] 155751
p_flow_id 120
p_flow_step_id 0
p_instance 4466366911674565
p_request APPLICATION_PROCESS=get_emp_details
Source
p_request=APPLICATION_PROCESS%3Dget_emp_details&p_flow_id=120&p_flow_step_id=0&p_instance=4466366911674565&p_arg_names%5B%5D=P2_BADGE&p_arg_values%5B%5D=155751