Oracle APEX - Set and Get Page Items with JavaScript

In this example, I'm setting two page items using the data attributes from a button and refreshing three regions in a drawer. The drawer is then opened using the Open Region dynamic action.

The button has the following link attributes data-id="&APP_ID." data-env="&ENV_ID.". This data is derived from a cards faceted search region query with buttons added as card actions.

//button click dynamic action
var x = this.triggeringElement.getAttribute("data-id");
var y = this.triggeringElement.getAttribute("data-env");

apex.item("P1_APPID").setValue(x);
apex.item("P1_ENVID").setValue(y);

refreshRegions();

function refreshRegions() {
  apex.region("app-meta").refresh();
  apex.region("app-stats").refresh();
  apex.region("app-usage").refresh();
}

Using JavaScript to Set & Retrieve Oracle Apex Page Items

6 Different Ways to Set Oracle APEX Page Item Value

$("#P1_PAGEITEM").val(20);
$x("P1_PAGEITEM").value = 30;
document.getElementById('P1_PAGEITEM').value = 40;
document.querySelector('#P1_PAGEITEM').value = 50;
apex.item('P1_PAGEITEM').setValue(60);
apex.items.P1_PAGEITEM.value(70);

6 Different Ways to Get Oracle APEX Page Item Value

$("#P1_PAGEITEM").val();
$v("P1_PAGEITEM");
document.getElementById('P1_PAGEITEM').value;
document.querySelector('#P1_PAGEITEM').value;
apex.item('P1_PAGEITEM').getValue();
apex.items.P1_PAGEITEM.value;