最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

jquery - How to hide regions with javascript in Oracle Apex - Stack Overflow

programmeradmin10浏览0评论

I have a Radio group and depending on the value selected, I want a specific region to appear and make 2 other regions disappear.

However when I hide the regions, the region that is visible doesn't take all the space available which leaves an empty space.

Like this

I was using the $x_Hide('ItemID') method like a website suggested but it doesn't collapse the space like the page claimed.

I've noticed that the x_Hide doesn't actually remove the div where the region was.

The div is still present and its content is too.

I then tried the $x("ItemID").remove() function but this time the div was still there but its content was missing.

Is there a way to make it so that the remaining region takes all the available space?

I have a Radio group and depending on the value selected, I want a specific region to appear and make 2 other regions disappear.

However when I hide the regions, the region that is visible doesn't take all the space available which leaves an empty space.

Like this

I was using the $x_Hide('ItemID') method like a website suggested but it doesn't collapse the space like the page claimed.

I've noticed that the x_Hide doesn't actually remove the div where the region was.

The div is still present and its content is too.

I then tried the $x("ItemID").remove() function but this time the div was still there but its content was missing.

Is there a way to make it so that the remaining region takes all the available space?

Share Improve this question edited Oct 19, 2017 at 23:02 Hleb 7,39114 gold badges64 silver badges126 bronze badges asked Feb 16, 2017 at 20:48 HastarothHastaroth 511 gold badge2 silver badges7 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 3

I always make use of built-in Apex functionalities whenever possible. However, if I run into quirky behavior, my last resort would be a custom JS/JQuery solution. So below is an alternative.

By making use of the JQuery library that ships with Apex, you can do the following:

1) Add a static ID to your target region;

2) Then just create a JQuery function that will hide this region:

function hideRegion(ID) {
    $(ID).hide();
}

Place this code either in your external JS file, or your page-level (or inline) JS (the "Global Variable Declarations.." portion).

3) Then you can call (or execute) this function like so:

hideRegion('#the-static-id');

note: place this inside of whatever dynamic action you're triggering to hide the region.

4) Then to show it again, create the JQuery function:

function showRegion(ID) {
    $(ID).show();
}

Place this code either in your external JS file, or your page-level (or inline) JS (the "Global Variable Declarations.." portion).

3) Then you can just call this function like so:

showRegion('#the-static-id');

Now place this inside of whatever dynamic action you're triggering to show the region again.

Why this should work

The .hide() action is quite similar to making the target div have a display:none property in CSS. As such, the other regions should take up the space that was left by the region you hid through the function above. Meanwhile, .show() reverts it to its original display style.

Hope this helps!

UI design of APEX is responsive out of the box. All you will need is to get the handle of right region and hide it. The effect that you are looking for will get applied if done right. In case you are having difficulties locating appropriate regions using javascript then other simpler solution would be to use Dynamic Actions feature and would be go to option if you are just beginning with APEX. Dynamic actions provide a way to define plex client-side behavior declaratively without the need for JavaScript.

Refer Oracle Docs for more info on Dynamic Actions --> link

发布评论

评论列表(0)

  1. 暂无评论