JQuery Tabs and Apex 4.2

Similar Questions

• jQuery Tabs in APEX 5.0.1

  Hello world

  I used this tutorial:

  Tabs within the APEX (using jQuery) "Warp11.:.» Group knowledge Oracle Apex

  to book jQuery Tabs in my APEX applications. It works in APEX 4.0, but is not in 5.0.1.

  Does anyone know why?

  It is similar to the layout:

  

  and this is what the page looks like after running:

  

  I appreciate any help in advance.

  Hello Farzad,

  the same thing happened to me as well but fortunaely APEX 5 offers a built-in feature to the tabs, while it was easy to migrate. To create tabs in 5 APEX, create a region Type: region display selector, model: tabs container and that's all you need to do.

  Kind regards

  Pavel

• JQuery tabs in the apex

  Hello

  I followed the https://forums.oracle.com/message/4425187#4423187 thread to create templates for jquery tabs and has been a success. However, I have a question, i.e. default tab1 is in open State. Can anyone tell how to change the status of the two locking tabs when loading?

  Apex News:

  Request Express 4.2.2.00.11

  Details of DB - database Oracle 11 g Enterprise Edition Release 11.2.0.1.0

  Architecture of Web - APEX listener Server

  Browser (s) and version (s) used - Chrome version 24 / Firefox version 3.6 and 22

  Thanks in advance!

  Do you want to say that you do not want any tab is selected when the page shows up first?  interesting.

  You do not want to remove these classes from the tab: ui-tabs-selected and ui-State-active.

  Maybe with the code like this.

  $("li.ui-state-active").removeClass ("ui-tabs-selected ui-State-active");

  And you will need to hide the content area by adding "ui-tabs-hide".

  This probably better by targeting only the region that needs to be hidden by building its id with this syntax #REGION_STATIC_ID#-tab-#SUB_REGION_ID# .

  $("jqtabs-tab-subTabID").addClass ("ui-tabs-hide");

  Or if you don't know that, then their target with one class, they all get as ui-tabs-Panel

  Thank you

  -Jorge

  http://rimblas.com/blog/

• Positioning on a jquery tab area

  All,
  
  I use jquery tabs and accordion jquey on this apex page.
  Here is the screenshot of the pagehttp://www.scrnshots.com/users/test/screenshots/268397
  
  The problem I have is that the regions under the "Custom" tab are not surrounded completely with tab (tab in the screenshot).
  
  In order to position the region (PDS beginning tabs), I use CSS float property. As soon as I apply the style float: left PDS tabs start region, it is not enclosed with in the tab more.
  
  Any help is appreciated.

  Hello ally,.
  Its a little hard to tell what is wrong with the style without displaying the content of the page.

  Here's something that comes to mind when you mentioned the issues float
  Add a dummy element that clears the float settings after each of the floating elements.

  For example. If the PDS region has applied float
  Add the following code immediately after this div (?).

  < br style = "" clear: both "/ >"

  If this does not work, you will have to give some kind of access so that others can see atleast page to see the css.

• problem with JQuery TAB when I refresh the Page

  Hello
  
  I use a JQuery tab and I have following tabs under the present.
  
  tab1
  tab2
  tab 3
  
  When I click on tab1, tab2, tab3 individually it works fine.
  
  problem... Now, when I click on tab 3 and then I refresh the page, the control returns to the first tab tab1.
  
  what I want... If I'm on tab2, and I update the page... control must remain on the same tab (i.e. on tab2)... control should not go back to tab1 *(the first tab) *.
  
  Thank you
  Deepak

  Hello

  This might help
  http://dbswh.webhop.NET/dbswh/f?p=blog:read:0:article:195800346705831

  Kind regards
  Jari

• Do not mix variables of substitution for the title area and JQuery Tabs

  Hello
  
  I've implemented Jquery tabs to the Apex 4 using this great piece of Patrick Wolf:
  
  Re: New themes in APEX 4 does not not with JQuery tabs
  
  However, there is a problem and I don't know if it's a bug or it is me who is missing something... If I put substitution variables, as in the title of the subregion (e.g. customer and P10_CUSTOMER_NAME.), the substitution variable do not get overridden and the text is displayed as in the tab.
  
  The variable is properly developed in the region title itself (which appears inside the tab). Simple example:
  

  +----------------------------+
  | Customer &P_CUSTOMER_NAME. |  <--- TAB
  |                            +------------
  |
  | +----------------------------------
  | | Customer Luis                     <-- SUB-REGION TITLE
  | +----------------------------------
  | |
  | |

  The header entry is defined as:
  

  <li><a href="##REGION_STATIC_ID#-tab-#SUB_REGION_ID#">#SUB_REGION_TITLE#</a></li>

  Shouldn't the chain of substitution #SUB_REGION_TITLE # be converted to the title of region with the extended substitution variables?
  
  No work around?
  
  Thank you
  Luis

  Luis

  However, there is a problem and I don't know if it's a bug or it is me who is missing something... If I put substitution variables, as in the title of the subregion (e.g., client & P10_CUSTOMER_NAME) the substitution variable does not get overridden and the text is displayed as in the tab.

  Confirmed. Looks like a bug. Probably substitute on the title (sub-) region is not performed until the region is rendered, but the subregion headers list is generated before that.

  No work around?

  All I can think so far uses a dynamic/JavaScript Action to change the label of the tab when the page is rendered.

• Problem with JQuery tab after you migrate towards the APEX 4.0

  My test application hosted on apex.oracle.com use the JQuery tab function and it works well with APEX 3.2.1.
  And now after the migration to the APEX 4.0, it cannot display the tab more.
  
  No idea how to solve this problem?
  
  Thank you very much.

  Glad to hear your problems resolved. Don't forget to vote for any message that has been useful or responded to your message.

• create jquery TABS simple in apex

  All,
  I'm creating TABS jquery based in apex, but I realized its not working not as I thought... I really need help on this please?
  
  that I created in my area, I added code below

  <div id="tabs">
  <ul>
  <li><a href="#">Nunc tincidunt</a></li>
  <li><a href="#">Proin dolor</a></li>
  <li><a href="#">Aenean lacinia</a></li>
  </ul>
  </div>
  
  then at page header i made references,
  
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="#WORKSPACES_IMAGES#style.css" />

  that I added the region of the child to the foregoing.
  
  but not everything works... .your help is sincerely appreciated

  First of all, why you are referencing a new version of jquery which is bundled with APEX? Here is a simple solution for your problem: http://www.warp11.nl/2011/04/tabs-within-apex-using-jquery/

  Thank you

  Tony Miller
  Software LuvMuffin
  Ruckersville, WILL

• Jquery tabs application problem

  All,
  I'm trying to implement jQuery tabs in my application and my page is just blank. Here are the details:
  
  Apex version: 4.0.0
  Database: 10g
  Browser: IE 7.0
  Topic: Topic 8
  
  I followed the steps in one of the blog of Dan Mcghan and here's what I did...
  
  1. I downloaded the jquery.com .js file and he fell on the application server under is a sub-folder of jquery. The latest version I have is jquery - 1.4.4.js, that is the right version or there is a jquery UI that is different from what I have?
  
  2. I went to the page template 'without tab' that has 1 reference (if it does not show the page referenced in its properties), but I have only 1 page in my application I am so I guess that's the only one, I wrote this 1 line (in bold)
  
  < html lang = "" & BROWSER_LANGUAGE. ">"
  < head >
  "* < script type =" text/javascript"src="/i/jquery/jquery-1.4.4.js "> < / script > *.
  < title > #TITLE # < /title >
  #HEAD #.
  "< link rel ="stylesheet"href="#IMAGE_PREFIX#themes/theme_8/theme_4_0.css "type =" text/css"/ >
  < / head >
  < body > #ONLOAD # #FORM_OPEN #.
  
  I think that this script tag now includes the jquery library in my applications. I did it on the page under the shared components model.
  
  3. I create a model of region name base Div in shared components of custom Type 1 and I put this code on it.
  < div id = "' #REGION_STATIC_ID # ' #REGION_ATTRIBUTES # class ="basic_div">"
  #BODY #.
  < / div >
  
  4. I have assigned a static id in each region, changed the name of the Div-based model and place my 2 new tabs region HTML regions. In the region to start HTML tab I wrote
  < div id = "tabs_start_reg" style = "" display: none; ">"
  < ul >
  Reconciliationof < li > < li >
  < Li >trend< li >
  < /ul >
  
  In the end, the HTML tab region, I said that line.
  < / div >
  
  All these tabs are sequenced in order and HTML tabs and is not any model.
  
  5. in the properties page in the header HTML part, I did this to activate the tabs...
  < script type = "text/javascript" >
  <! [CDATA]
  
  $(function() {})
  $tabs = $("#tabs_start_reg");
  $tabs.tabs ();
  $tabs.parents('td').eq (0) .removeAttr ('width');
  $tabs.show ();
  });
  
  []] >
  < /script >
  
  6. when I run the app, it shows me the page as empty... nothing on it.
  
  What may be...? I paint in white... Any help is appreciated.
  
  Vishal-

  See this thread {message identifier: = 4352963}

  Note the Alistair Lang post towards the end of using the 4.0 libraries provided compared to Google.

  Patrick Wolf also promotes a method well designed at the end of the thread.

  Jeff

• Adding a few values for tab and use them in page

  I have an apex page that I want to use the same page for different tabs except that the query condition changes.

  Lets say, I have 3 tabs - Finance, sales, Marketing.

  I have a page which requests for the list of employees in a specific area (finance, sales, Marketing).

  I will eventually have 3 different types of queries, as below. The only change between them is the area.

  SELECT name, salary from employee where area = 'funding '.

  SELECT name, salary from employee where area = "sales";

  SELECT name, salary from employees where area = 'Marketing ';

  Is it possible to make my query in the following way to ensure that I get the TAB_ID of the value of the tab that I store.

  SELECT name, salary from employees where area is TAB_ID;

  What is the way to store one or more values of the TAB and use them in queries for a page.

  Your help is appreciated.

  Thank you

  user756931 wrote:

  Please update your forum profile with a real handle instead of 'user756931 '.

  I have an apex page that I want to use the same page for different tabs except that the query condition changes.

  Lets say, I have 3 tabs - Finance, sales, Marketing.

  I have a page which requests for the list of employees in a specific area (finance, sales, Marketing).

  I will eventually have 3 different types of queries, as below. The only change between them is the area.

  SELECT name, salary from employee where area = 'funding '.

  SELECT name, salary from employee where area = "sales";

  SELECT name, salary from employees where area = 'Marketing ';

  Is it possible to make my query in the following way to ensure that I get the TAB_ID of the value of the tab that I store.

  SELECT name, salary from employees where area is TAB_ID;

  What is the way to store one or more values of the TAB and use them in queries for a page.

  Assuming that by "tabs" you mean standard tabs and that the page contains a report of the region, so there is no way to do out of the box. Try to apply it using the standard tabs would hit two major obstacles:

  • He has no way of passing item values using tabs.
  • As all 3 tabs linking to the same page, they would be displayed under the current name of the page, which are strange and confusing.

  While it would be possible to work around this using the value ASK emanate a branch of each tab, and JavaScript, which would take you away from standard tab behavior, which is pretty weird, as is.

  Another possibility is to use the list rather than the standard tabs tabbed browsing, but which raise problems in integrating into the layout and navigation of the application structure.

  Therefore, I would propose two alternative approaches:

  1. by far the easiest way to implement this should forget the tabs and use a group of radio buttons or select list page to allow users to select the area, to include this item in the property Page to send Items of the region report and add dynamic action to refresh the report when the selection is changed. The report query would be:

  select
      e.name
    , e.salary
  from
      employees e
  where
      e.area = :p1_area
  

  In addition to being simple to understand and build, this has the advantage of being low maintenance and relatively future proof if the LOV which underlies the question of selection is dynamic and so automatically meets the future changes to the areas.

  2. If you are really determined to use tabs, then create 3 separate pages in finance, sales and Marketing with a tab for each, but locate the region report on an overall Page and display it conditionally on the necessary pages. The report query can then determine the desired area of the APEX_APPLICATION_TABS view by using the ID of the page to get the name of the associated tab:

  select
      e.name
    , e.salary
  from
      employees e
  where
      e.area = (select
                    aat.tab_label
                from
                    apex_application_tabs aat
                where
                    aat.application_id = :app_id
                and aat.tab_page = :app_page_id)
  

• try to implement jQuery clock and I have some doubts...

  First of all should I install the jquery library in apex 4...
  I thought that the library jquery already present in the apex 4...
  What are the new features of jquery in apex 4... I am comparing it with apex 3...
  I thought that jquery is integrated in the apex 4...
  
  
  See the example in the following link
  http://Apex-notes.blogspot.in/2008/11/timepicker-and-apex.html
  
  I did everything mentioned above... the link above apex-notes...
  But I can't seem to get the time clock...
  Do not know where this part of the code should be added... It's the last activiity mentioned in the above link... http://Apex-notes.blogspot.in/2008/11/timepicker-and-apex.html
  script type = "text/javascript" >
  {$(document) .ready (function ()}
  cback function (time) {}
  var c is $("< div style =' couleur: rouge" > heure d'entrée: "+ temps +" </div > ");.
  c
  . Hide()
  .insertAfter (this)
  .fadeIn (1000)
  .fadeOut (1000);
  }
  
  
  $("#P9_TIME").unbind (.clockpick({))
  StartHour: 8,
  EndHour: 20,
  ({showminutes: true}, cback);
  
  
  });
  
  < /script >
  
  Published by: susf on 19 June 2012 02:35

  Why all expect you a clock? It won't show a Visual clock just because javascript library name is clock.

  First of all know what he does and then put implementation.

  Learn jQuery and try some of these plugins

  http://www.ajaxupdates.com/jclock-jQuery-clock-plugin/

  http://joaquinnunez.CL/jQuery-clock-plugin/

  http://www.Google.co.UK/search?AQ=0&OQ=jQuery+clock+&sugexp=chrome, mod = 0 & sourceid = chrome & ie = UTF - 8 & q = jquery + clock + plugin

• Internet Explorer and apex 4.1

  Hello
  I asked at the Apex 4.1. Application in Firefox and Chrome has a normal behavior. But it seems that IE9 has sometimes problem with it.
  Sometimes, I need to click twice on a button, tab, or a link. After first click Start IE do any action (symbol on the tab page is turning = IE does some thing), but in real time, nothing happens. I'm still on the first page and no navigation or action is executed. I need to click on this link for the second time and IE makes navigation to another page or send form etc...
  
  This behavior seems to be random, because I'm not table to simulate. When I click on the link that caused this problem later, everything works fine on the first click. After a while, I need to click twice on the same link...
  
  The title of a page of the tab action is

  javascript:apex.submit('TAB1')

  But I have the same problem with another standard (standard navigation between pages, form submiting...) links or buttons validate. IE seems to be something after the first click, but it's to stay always on the first page. I need to click on the button, link, to the second tab and do action I want.
  
  Thanks for some tips...
  
  Published by: square on May 2, 2012 11:31

  I found the solution.
  It was not THE problem, but the reason for this strange behavior was bad configuration of Apache.

  I needed to add the directives to httpd.conf

  AcceptFilter http none
  EnableSendfile Off
  EnableMMAP off 
  

  So this is a problem with the operating system and file system, where Apache is installed.

  I have 2.4 Apache as a reverse proxy on win2008 x 68 WEB server edition installed and connected to the server of EPG in Oracle XE with Apex 4.1 11.2.

• JQuery Tabs

  JQuery, I installed and I have a page with the calendar, the resizable text box and Drag and Drop point and they are all working well.
  I'm now trying to get JQuey tabs to work, but I have problems. I followed the instructions of Dan, but I don't see any tabs.
  
  I created the new model region base Div
  My first page rerion (no model)
  
  I have replace the tags opening with a * to view the code on the forum
  
  * div id = "tabs_start_reg" style = "" display: none; ">"
  * ul >
  * li > < a href = "S" > Security < /a > < /li >
  * li > < a href = "DRAG_ID" > Drag < /a > < /li >
  * /ul >
  
  
  
  Then I have 2 areas that should appear on 2 different tabs.
  Model is the basis of Div
  The static region id is DRY and DRAG_ID
  
  My final area (no model) contains
  * div >
  
  
  Then I have in my page header
  
  < script type = "text/javascript" src = "& JAVASCRIPT_DIR.jquery/jquery-1.3.2.js" > < / script >
  
  < link type = "text/css" href = "& CSS_DIR.jquery - ui - 1.7.2.custom.css" rel = "stylesheet" / >
  
  < script type = "text/javascript" src = "& JAVASCRIPT_DIR.jquery/jqueryui/jquery-ui-1.7.2.custom.js" > < / script >
  
  
  < link type = "text/css" rel = "stylesheet".
  href = "" #WORKSPACE_IMAGES #Calendar.gif "/ >"
  
  < script type = "text/javascript" >
  <! [CDATA]
  $(document) .ready (function () {}
  
  $tabs = $("tabs_start_reg");
  $tabs.tabs ();
  $tabs.parents('td').eq (0) .removeAttr ('width');
  $tabs.show ();
  
  
  $. datepicker.setDefaults({)
  dateFormat: dd/mm/yy"."
  changeMonth: true,
  changeYear: true,
  showOtherMonths: true,
  showButtonPanel: true,
  closeText: 'Close,'
  yearRange: "1900:2020."
  Duration: "fast."
  showOn: 'button ',.
  ButtonImageGadget: "#WORKSPACE_IMAGES #calendar.gif."
  buttonImageOnly: true
  
  });
  
  $('#P15_AA').datepicker ();
  $('#P15_DOB').datepicker ();
  $('#P15_START_PERIOD').datepicker ();
  $('#P15_END_PERIOD').datepicker ();
  
  () $("#P15_T1").resizable
  {
  autoHide: true,
  maxHeight: 500,.
  maxWidth: 510.
  minHeight: 20,.
  minWidth: 180
  }
  );
  
  $("#DRAG_ID").css ("background-color", "white");
  $("#DRAG_ID").draggable ();
  
  $("#DRAG_ID").parent () .css ("border-style", "hidden");
  
  $("#DRAG_ID").parent (.droppable({))
  accept: "#DRAG_ID."
  activeClass: 'active droppable.
  hoverClass: "able to receive the mouse."
  course: function (e, ui) {}
  $(this) .css ("border-style", "dashed");
  },
  out: function (e, ui) {}
  $(this) .css ("border-style", "dotted");
  },
  Drop: function (e, ui) {}
  $(this) .css ("border-style", "none");
  }
  });
  
  });
  []] >
  < /script >
  
  Can someone tell me where I'm wrong
  
  Gus
  
  Published by: Gus C on August 18, 2009 01:44
  
  Published by: Gus C on August 18, 2009 01:45
  
  Published by: Gus C on August 18, 2009 01:46
  
  Published by: Gus C on August 18, 2009 01:47

  Hello Gus,

  You can take a look at your app now...
  1. I incorporated jQuery stuff and downloaded a CSS.
  2. I removed $(document) .ready (function () {, because it is the same as {$(function()}})
  3. I changed $("tabs_start_reg"); $ ("#tabs_start_reg");
  4. I changed a href = '20' to the a href = "#20".

  That's all!

  Greetings,
  Roel

  http://roelhartman.blogspot.com/

• My Firefox has lost all the standard tabs and search is no longer using Google?

  Today, my former excellent Firefox all lost it's memory. My standard tabs in the top bar are all gone. He constantly only to search in Yahoo, I hate. I want to like it was yesterday. I want that all my tabs back and I want it to look using Google. I tried to set up an account and Sync, but anything doesn't work as it keeps going back to a new start empty without tabs and Yahoo search.

  Look at your desktop. You see a folder called; Old Firefox?

  https://support.Mozilla.org/en-us/KB/recovering-important-data-from-an-old-profile

  https://support.Mozilla.org/en-us/KB/back-and-restore-information-Firefox-profiles

• suddenly I'm asking as a new tab and not google search - driving me crazy

  Ask the home page is driving me crazy. I want my google search customary as that which opens when I press on the new tab. I was everywhere on the internet to try to fix this. nothing works.

  Since there are different options/settings of the standard page in a new window or a new tab, could you confirm if you have one or two of these problems:

  • Ask if poster at the start, in a new window (Cmd + n), and when you click the Home button
  • Ask appears when you open a new tab in the same window (Cmd + t)

  For these two problems, the first thing to check is an unwanted extension. You can view, disable and often remove the extensions on page modules. Either:

  • CMD + SHIFT + a (Windows: Ctrl + Shift + a)
  • "3-bar" menu button (or tools) > Add-ons

  In the left column, click Extensions. Then take a critical look at the extensions listed on the right side. If in doubt, disable or remove if possible. Remember that all extensions are optional, none come with Firefox.

  Often, a link will appear above at least an extension disabled to restart Firefox. You can complete your work on the tab and click one of the links in the last step.

  Which allows you to regain control of your homepage and view the standard Firefox new tab page?

  If so, here are the details on how to restore your preferred homepage:

  • Startup, homepage, tabs and download settings
  • How to set the home page

  If you find that it works in your session (Cmd + n and give you good home page), but after leaving Firefox and commissioning once again you have bad home page, look for an optional settings file named user.js in your profile (personal settings folder) folder. Firefox uses the settings in this file at startup to override your preferences since the previous session. You can check and delete the file by following the steps in this article: How to fix preferences that will not save (there is a specific section on the user.js files).

  Display Google in a new tab page requires a different approach. From Firefox 41, the browser.newtab.url parameter is no longer used because it was constantly attacked by malware. Now, you need an add-on to change the new tab page.

  Here are a few options (I'm learning more all the time):

  • If you are already using the "Restorer of classic theme" or "Tab Mix Plus" extension: There is an option somewhere (!) in his dialogues of the parameters to select another page in the new tab.
  • If you want to use your new tab homepage: Try https://addons.mozilla.org/firefox/addon/new-tab-homepage/
  • If you want to set another page or a completely blank page: Try https://addons.mozilla.org/firefox/addon/new-tab-override/
  • If you want the cursor to move in a search box in the page: Try https://addons.mozilla.org/firefox/addon/custom-new-tab/

  Use only one of these methods at the same time, otherwise there may be conflicts and dysfunctions.

  Setting up substitute new tab and new tab custom

  After installing one of these extensions, you must use the Options page to set the new desired tab page (instead of use subject: config).

  Open the page modules using either:

  • CTRL + SHIFT + a (Mac: Cmd + shift + a)
  • "3-bar" menu button (or tools) > Add-ons

  In the left column, click Extensions. Then on the side right, find the new tab replace or custom new tab and click on the Options button. (See first screenshot attached).

  New tab Override

  Depending on the size of your screen, you may need to scroll down to enter the address in the form. (See second screenshot attached). For example:

  • (Default) page thumbnails = > subject: newtab
  • Blank tab = > subject: empty
  • Built-in Firefox homepage = > topic: welcome
  • Any other page = > full URL of the page

  Then tab or click this form field and you can test using Ctrl + t.

  Custom new tab

  It is easy to enter your favourite homepage address. If you check either of the boxes, the expansion will set the focus in the page as well, for example, the cursor will be in the Google search box. (See third screenshot attached). I had to leave Firefox and start it up again before new custom tab started working, but this may have been due to tests so many extensions back to back.

  Success?