1. Overview
We know that there is an button option to delete record in oracle apex. But in some scenarios we may have to delete records instead of buttons but on report link. The following steps will help you create a delete option using ajex.
2. Technologies and Tools Used
The following technology has been used to achieve the same.
- Javascript
- Oracle Apex
3. Use Case
Suppose you want to delete the data from record you may use this “Delete data using ajex”method .
4. Architecture
Following steps explains in detail,
Step 1: Create a new blank page.
Step 2: Create a new region
Under identification you can give the title
Step 3: Create a apex collection.
First Create Page item and button
Now create Dynamic action for Save Button.
Use Below code inside PL/SQL:
BEGIN
IF NOT APEX_COLLECTION.COLLECTION_EXISTS(‘INFO’)THEN
APEX_COLLECTION.CREATE_COLLECTION(‘INFO’);
END IF;
apex_collection.add_member(
p_collection_name => ‘INFO’,
P_C001 => :P5_ID,
P_C002 => :P5_NAME
);
END;
Step 4: Create a Report.
Use below query:
SELECT SEQ_ID,C001 ID ,C002 NAME
FROM APEX_COLLECTIONS
WHERE COLLECTION_NAME =’INFO’
Now, create Refresh and clear true action
Step 5: Create Process for AJEX .
Use below code inside PL/SQL :
BEGIN
APEX_COLLECTION.DELETE_MEMBER(‘INFO’,
apex_application.g_x01
);
commit;
END;
Step 6:Write a function on Function and global variable Declaration Part.
function deleteItem(p_this, p_item){
var tr = $(p_this).closest(‘tr’);
}
$.ajex({
type: ‘POST’,
url: ‘wwv_flow.show’,
data: {
p_flow_id: $(‘#pFlowId’).val(),
p_flow_step_id: $(‘#pFlowStepId’).val(),
p_instance: $(‘#pInstance’).val(),
x01: p_item,
p_request: ‘APPLICATION_PROCESS=AJEX_CALLBACK’
},
beforeSend:
function() {
tr.removeClass(‘even’);
tr.removeClass(‘odd’);
tr.children().hover(function() {
tr.children().animate({‘backgroundColor’: ‘#fbc7c7’}, 300);
},function(){
tr.children().animate({‘backgroundColor’: ‘#fbc7c7’}, 300);
});
tr.children().animate({‘backgroundColor’: ‘#fbc7c7’}, 300);
},
success:
function(){
tr.children().wrapInner(‘<div>’).children().fadeOut(400,function() {
tr.remove();
});
}
});
Step 7:Now Change Seq No as link on report.
Link text : <span aria-hidden=”true” class=”fa fa-recycle”></span>
Link Attributes: onclick=”deleteItem(this,#SEQ_ID#)”
5. Screen Shot
Output
