We Keep Coding

How can I dynamically control a Region Display Selector in Oracle APEX?

I'm hoping to select a particular Region to highlight on the page load based on the link the user follows to get to that page. This is a drill-down report with multiple options, so the goal is to have all options available but focus on the one the user selected to reduce the number of times a user has to navigate to/from the base report to the drill-downs.
Currently, I'm trying to implement this solution https://svenweller.wordpress.com.../, further explained in an Oracle Community discussion here: https://community.oracle.com/..., but it is not working for me.
What I have now is similar to what is shown in those examples, and for now I'm just trying to link to a static Region Display Selector (RDS) tab (the goal will be to have the selected Region be dynamic based on which link is clicked in the feeder page, but I'm clearly not there yet).
I have a Dynamic Action set to fire on Page Load event, and a True action that executes JavaScript code and uses the JavaScript in the example (both with and without the Timeout function suggested in the Oracle thread). I have set Static IDs for the RDS and Region, but when I load the page the RDS still defaults to Show All (or the first region if Show All is off).
Can someone help me understand what I'm doing wrong?
Thanks.
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
setTimeout(sesStorage.setItem( "tabs.activeTab", "#R3" ) { apex.region("tabs").widget().aTabs("getTabs")["#R3"].makeActive();}, 300);
\\version without setTimeout
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
sesStorage.setItem( "tabs.activeTab", "#R3" );

I have done something like this in the past. Create a hidden variable on the page P1_TEST, make sure to set the value not to be protected.
You will need to set the value of that variable when the link is clicked.
Then you need to add static IDs TAB1, TAB2 etc. to the tabs of you region display selector.
Then add a DA on Page Load:
if (apex.item("P1_TEST").getValue() === "Value1"){
$(".apex-rds [href='#TAB1']").trigger('click');
} else if (apex.item("P1_TEST").getValue() === "Value2"){
$(".apex-rds [href='#TAB2']").trigger('click');
}

Getting free of scrolling up after submit in Oracle Apex

Good evening to everybody.
At this moment I'm working on a new page for Oracle Apex and again I have trouble with Interactive Report. My page (let it be named 500) consists of Interactive Report with id rep_main and Classic one with id rep_child, which are connected by master-detail logic (I choose the row from the main report and then I get the rows in the child one depending on my choice). Also every row of the main report has several buttons (precisely tags "a" with links like "javascript:..."), which call dialog windows for updating data of the chosen row.
My aim is to make page more comfortable for users: firstly, the chosen row from the main report should change its color; secondly, the reports should refresh correctly. The second condition means, that, after I choose the rown in the main report, the pagination must not change and the view of the page must not scroll up by itself.
I managed to make the master-detail logic and recoloring the rows (thanks to Stack Overflow for helping me with this task) in my IR, but I have some difficulties with the condition of correct refresh. Apart from JavaScript/jQuery functions, I have to call standard Apex function apex.submit, because if I don't do this, pagination of my IR won't save, but at the same time the page scrolls up by itself, which is very unlikely for users. Moreover, the pagination resets after any dialog window appears.
I've tried to find solution in Google, but all is in vain. I hope that somebody knows if there is any workaround in my case (against the scrolling up at least).
I use Oracle Apex 4.2.6.00.03 and application is executed mainly through Mozilla Firefox. The code I wrote for my page 500 is written below in the current post.
On the page load executes the process with PL/SQL lines like this:
:P500_MAIN_ID := APEX_UTIL.GET_NUMERIC_SESSION_STATE(P_ITEM => 'P500_MAIN_ID'); --receiving the chosen row's ID saved in session
The main report region header contains the following script:
<script>
$("#rep_main").find("table.apexir_WORKSHEET_DATA td).live("click",function(){
var chosenOne = $(this).find("span").attr("id"); //finding ID of the chosen row
chooseMAIN(chosenOne);
apex.submit({set:{'P500_MAIN_ID':chosenOne,'P500_CHILD_ID':null}});
});
</script>
In this code P500_CHILD_RN is the item for saving ID of child report's row and the function chooseMAIN is:
function chooseMAIN(docID){
$.post('wwv_flow.show',
{'p_request' : 'APPLICATION_PROCESS=SET_MAIN',
'p_flow_id' : $v('pFlowId'),
'p_flow_step_id' : $v('pFlowStepId'),
'p_instance' : $v('pInstance'),
'x01' : docID},
function(data){
//for the opportunity to get the ID in pure JavaScript
$("#P500_MAIN_ID").val(docID);
$("#P500_CHILD_ID").val("");
$("#rep_main").trigger('apexrefresh');
$("rep_child").trigger('apexrefresh');
}
);
}
The process SET_MAIN looks this way:
begin
APEX_UTIL.SET_SESSION_STATE(P_NAME => 'P500_CHILD_ID',P_VALUE => NULL);
APEX_UTIL.SET_SESSION_STATE(P_NAME => 'P500_MAIN_ID',P_VALUE => APEX_APPLICATION.G_X01);
end;
p.s. Earlier I asked some help with IR here, but I still haven't found proper solution (except making a submit, which has its side effects I said about).

what you really want to use in this case is the FOEX plug-in because its AJAX based so you don't need to submit.
FOEX website
And do yourself a favor and move away from 4.2 you'll thank me later..

How does HTML pagination work without a link or script?

Consider the following link:
https://www.officeworks.com.au/shop/officeworks/c/technology/monitors-digital-signage/27--monitors
The "View 100 per page" link does not change the url, nor does it have an onclick() attribute, yet it does reload the page and show up to 100 items. What variable has changed here, and how is it stored? Is it possible to get the HTML of the page with 100 items directly, without having to click the link or reload? Or get the page with 100 items programatically? (eg in Python)

One answer is the Ajax and Event system un Javascript.
You can have one HTML item like
<button id="but1">Show 100 items</button>
and add a "click" event on it from Javascript (example with JQuery)
$("#but1").click(function_but1_click);
This will launch the function_but1_click() function when the HTML button is clicked by the user.
After it, you can ask this function to perform an Ajax request to bring more data to the page (Example with JQuery)
function_but1_click()
{
$.get('myDataLoader.php',function(data){
items = JSON.parse(data)
draw_my_items(items)
});
}
And then implement the draw_my_items() function to display your new item on the screen.

The content is loaded dynamicly, an example of such feature is jQuery Ajax
http://api.jquery.com/jquery.ajax/
There is no need to add a link, or onclick. You can bind event handlers to html tags / classes / IDs ...
https://api.jquery.com/click/
I think the storage happend on the server side, session side. Because i was not able to find a related cookie.
Good luck!

jQuery not updating SOME spans

I am building a web-based tool for the role-playing game GURPS. Data is maintained in several XML files that are loaded into arrays. Based on changes the user makes, data is re-populated into various spans, inputs and dropdowns from the arrays. No problem so far.
To give the user more feedback, I have a added an anchor that does a hover pop-up that shows the details of the current weapon. For the initial coding, these values were hard-coded while I worked out the rendering issues. Still no problems yet.
Now I am trying to actually populate the hover pop-up with real data. I can not get it to load the real data into the span! I have debugged the function and am certain that I have extracted the data I want. I have used similar lines of code to populate other parts of the web page.
Specifics: I want to replace the "aa" in the span below:
<span id="weaponName1" name="weaponName1" class="weaponName">aa</span><img src="Images/Firearms/Makarov_Suppressed.jpg">
The code I am using to try to re-populate the span is:
function loadWeaponStats(person, weaponID) {
// Load stats of the current weapon into the "Details" anchor fly-out
for (xx1=0; xx1<WeaponsArray.length; xx1++) {
if (weaponID == WeaponsArray[xx1][0]) {
weaponName = WeaponsArray[xx1][1];
alert("weaponName: "+weaponName+"\nperson: "+person);
$("#weaponName"+person).val(weaponName);
xx1 = WeaponsArray.length; // Kill the loop
}
}
}
The alert() is simply to confirm that I have the correct data. The following line should re-populate the span, but it does not.
All HTML, CSS & JavaScript can be found at GURPS Combat Calculator
Pulling out what little hair I have left.
Thanks

You can also do as below:
$("#weaponName"+person).text(weaponName);
you can't use Val() method here.

editable datagrid with ability to clone individual rows

Im looking for a way to render an html table as an editable datgrid, with the ability to clone individual rows. I dont need to save any of the changes made, just superficially edit the cells because i then use a jquery plugin to scrape the table as is on screen and save it.
Ive tried jeditable, but its designed for posting the output of its edits to a page, not just superficially making the changes.
Ideally, i could control what types of inputs are displayed onclick based on what column they are on. The table cells are unnamed. If they need to be named, there are a total of 34 columns, so i would need to know how to name those individually.
Thanks in advance.

Jeditable's target can be a function (see the "Submitting to function instead of URL" section of the jeditable homepage) - you could pass an empty handler and use it.
[Edit]
The handler should return a string (that will be displayed on the page)
(taken from the example page)
$('#test').editable(function(value, settings) {
return(value);
}, {
type : 'textarea',
submit : 'OK',
});
It work nicely, I just tried it out.
[/Edit]