Model Dialog Runtime Resize / Round Corner / Title Color / Hide X on Dialog / hide Title Bar

-
Resize Model Dialog at run time

Region --> Appearance --> CSS Classes

js-dialog-size1200x600


Round Corner 

Execute when Page Loads

apex.util.getTopApex().jQuery(".ui-dialog").css({"border-radius": "8px 8px 8px 8px", "border-width": "1px"});
apex.util.getTopApex().jQuery(".ui-corner-all").css({"border-radius": "8px 8px 8px 8px", "border-width": "1px"});
apex.util.getTopApex().jQuery(".t-DialogRegion").css({"border-radius": "8px 8px 8px 8px", "border-width": "1px"});

OR

$(".ui-dialog").css({"border-radius": "8px 8px", "border-width": "0px"});
$(".ui-corner-all").css({"border-radius": "8px 8px 8px 8px", "border-width": "0px"});
$(".t-DialogRegion").css({"border-radius": "8px 8px 8px 8px", "border-width": "0px"});

$(".ui-dialog-titlebar").css({"background-color": "#309FDB", "color": "#fff"});


To handle Tile of Model then Create inline CSS, 

Css Inline

#ui-id-1{
 text-align:center;
 font-size: 20px;
  color: #fff;
}

if you have button on Model dialog at end  and assigned backgroup


.t-DialogRegion-buttons{
   border-radius:8px; 
    background-color:blue;
}

Hide Title 

Execute when Page Loads

$(".ui-dialog-titlebar").hide() ;

or 

var title = parent.$(".ui-dialog-titlebar");
title.hide(); //hide the button  

or CSS inline

.noTitleStuff .ui-dialog-titlebar {display:none}


.ui-dialog-titlebar {
    display: none;
}


Hide the x on the modal dialog

var button = parent.$('.ui-dialog-titlebar-close'); //get the button
button.hide(); //hide the button   

Useful Link 

https://forum.jquery.com/topic/ui-dialog-remove-title-bar


.ui-dialog .ui-dialog-titlebar {
    padding: .4em 1em;
    position: relative;
    -moz-border-radius-bottomleft: 0px/*{cornerRadius}*/;
    -webkit-border-bottom-left-radius: 0px/*{cornerRadius}*/;
    -khtml-border-bottom-left-radius: 0px/*{cornerRadius}*/;
    border-bottom-left-radius: 0px/*{cornerRadius}*/;
    -moz-border-radius-bottomright: 0px/*{cornerRadius}*/;
    -webkit-border-bottom-right-radius: 0px/*{cornerRadius}*/;
    -khtml-border-bottom-right-radius: 0px/*{cornerRadius}*/;
    border-bottom-right-radius: 0px/*{cornerRadius}*/;
}





Comments

  1. Najeeb Khan1 December 2020 at 09:38

    thanks for helping me in oracle apex development do you have any youtube channel?

    ReplyDelete
  2. Najeeb Khan1 December 2020 at 09:41

    and subscribe my channel and learn oracle apex css html and java js and many more sql plsql
    najeeb Alikhel and learn apex

    ReplyDelete

Post a Comment

Popular posts from this blog

Telegram Integration with Oracle

-
 How to Integrate Telegram with Oracle Apex 1) create Telegram Account in your Mobile like whatsapp 2) Ones you register in telegram apps serach for BotFather 3) To Create New Bot u need to enter below command  /newbot  Alright, a new bot. How are we going to call it? Please choose a name for your bot. Macsbot Good. Now let's choose a username for your bot. It must end in `bot`. Like this, for example: TetrisBot or tetris_bot. MacsOmanBot Done! Congratulations on your new bot. You will find it at t.me/MacsOmanBot. You can now add a description, about section and profile picture for your bot, see /help for a list of commands. By the way, when you've finished creating your cool bot, ping our Bot Support if you want a better username for it. Just make sure the bot is fully operational before you do this. Use this token to access the HTTP API:<Here you will prompt with your api> 4) /mybots (this command will return the list of bots which you have created) ...
Read more

The username or password for the connection pool named |apex||, are invalid, expired, or the account is locked

-
  1. Execute the following command from SQL Plus as the SYS user:  Conn sys/Pass@xe as sysdba  (connect as container if 12c then  ALTER SESSION SET container = CDB$ROOT;) Alter user ords_public_user identified by xxxx; ALTER USER ORDS_PUBLIC_USER ACCOUNT UNLOCK; Connect as PDB Conn sys/Pass@xepdb1 as sysdba (if 12c  ALTER SESSION SET container = PDB1;) Alter user APEX_PUBLIC_USER identified by xxxx; Alter user APEX_REST_PUBLIC_USER identified by xxxx; Alter user APEX_LISTENER identified by xxxx; 2. Unlock the users: ALTER USER APEX_PUBLIC_USER ACCOUNT UNLOCK; ALTER USER APEX_REST_PUBLIC_USER ACCOUNT UNLOCK; ALTER USER APEX_LISTENER ACCOUNT UNLOCK; ALTER USER ORDS_PUBLIC_USER ACCOUNT UNLOCK; 3. Now create a profile for the APEX related users: Create profile apex_public_profile limit password_life_time unlimited; 4. Assign the profile to the APEX users: alter user apex_public_user profile apex_public_profile; alter user apex_rest_public_user profile apex_public_pr...
Read more

Enabled SQL Developer Web (SDW) & ORDS Database API ORDS 19.4

-
SQL Developer Web (SDW)  ORDS 19.2 to 19.4 Migration /  Basic Setup to Enable ORDS Database API Bsic Information  Installing Oracle REST Data Services https://docs.oracle.com/en/database/oracle/oracle-rest-data-services/19.4/aelig/installing-REST-data-services.html#GUID-673D35DD-9811-42F8-A500-4F494F79C470 https://docs.oracle.com/en/database/oracle/oracle-rest-data-services/19.4/aelig/installing-REST-data-services.html#GUID-2C42D982-BF08-48E3-A4C6-3FE1A78287E3 Using Oracle® SQL Developer Web https://docs.oracle.com/en/database/oracle/sql-developer-web/19.2.1/sdweb/about-sdw.html#GUID-AF7601F9-7713-4ECC-8EC9-FB0296002C69 How to Configure / Run ORDS for SQL Developer Web and APEX in Standalone Mode: ORDS 19.4 + (Doc ID 2628004.1) GOAL This document is an overview on how to configure and run ORDS standalone for SQL Developer Web using the command line interface. It also includes the steps related to setting up APEX, since the ability to run APEX as well as SQL Develo...
Read more