Skillbuilders modal plugin performance

Hi all,
I would like to seek people's thoughts regarding page rendering performance when a large number of plug-ins are included on a page in APEX 4.2 with HTTP server.
Consider a hypothetical scenario where 12 instances of the Skillbuilders Modal Page plugin were defined for one page - various buttons that invoke their own DA.
This is consuming a large amount of rendering time according to the APEX debug report - each call to apex_modal_page_render adds up, and I'm considering my options.
a) Tune the plug-in code
I'm not sure how far we can go with this, I'm not sure where exactly the time is being taken - it's only fractional amounts adding up - including various conditions
(I'm disenchanted with APEX debugger reporting 0.047 for many entries...)
b) Add more juice.
but where? DB, application server, local pc with browser?
c) Consolidate the dynamic actions.
Each button has it's own dynamic action, with statically defined URL.
This was done because when we were first attempting to use plugin, this worked when the href attribute option did not. We should be able to work around this now.
I was wondering if anyone had anything to add? I'm trying to shave time off all aspects of the page render, there is no major bottleneck.
Cheers,
Scott

Thanks Dan.
I've sourced all my plugin supporting files direct from the fileserver instead of the database.
I have found some more conditional checks in between all the plugin definitions that I didn't spot before.
It seems I need to take greater care between using
:ITEM = 'VALUE'
vs
Expr1:ITEM
Expr2:VALUE
I've consider this before but never really had a chance to quantify it
http://tonyandrews.blogspot.com.au/2013/04/apex-conditions-and-performance.html
Scott

Similar Messages

  • Skillbuilders Modal plugin onclick attribute gets removed

    Hi,
    Apex 4.2.0.00.27, IE8, Firefox 17.0
    I am trying to use the Skillbuilders Modal plugin with a classic report. I followed the instructions and in the link column put the following in the link attributes:
    onclick="return false;" class="edit-link"
    When I click the classic report 'edit' link the new page opens full size instead of in a modal window (it works correctly from a separate button). Examination of the page in Firebug suggests that the 'onclick="return false;" attribute is being removed.
    Page Source excerpt:
    <tr class="highlight-row"><td headers="ID" class="data"><a href="f?p=1:52015:15766172029982::NO::P52015_ID:1" onclick="return false;" class="edit-link"><img src="/icas/edit.gif" alt=""></a></td><td headers="ADO_ASA_ID" class="data">1</td><td headers="EXT_BOD_ID" class="data">1</td><td headers="DATE_CREATED" class="data">29-May-2013</td><td headers="USER_CREATED" class="data">SC</td><td headers="EMPLOYEE_ID" class="data">1</td><td headers="DISCUSSION" class="data">test</td><td headers="CONTACT_DATE" class="data">29-May-2013</td></tr>
    Firebug excerpt:
    <a class="edit-link" href="f?p=1:52015:15766172029982::NO::P52015_ID:1">
    I tried create do a simple version to upload, but as is always the way, that one worked fine.
    Can anyone suggest why the onclick="return false" bit might be getting dropped?
    Thanks,
    Nick.

    Further info - the page in question has a Form and a Report region. The modal window opens correctly if I remove the page process for updating the form (the standard 'Process Row...'). Setting a condition of 'Never' has no effect, the mere prescence of this page process is enough to break it.
    Does anyone know if Apex 5.0 will have a simpler Modal functionality, or will it be based on this plugin? In other words, should I persevere with it or wait for the new version.
    Apologies for the useless code extract above - it looked fine when I posted this on the old forum but the new 'improved' one can't seem to cope with it.
    Nick.

  • Using Skillbuilders modal plugin with a non apex page

    Hello,
    I have created an apex application that includes a page with a button that uses the skillbuilders modal plugin in order to open a .jsp page. The issue is that the size is too short and I can not display all the components (Just the tittle and two buttons). I have tried to set up the height or weight but the size does not change. Any ideas?
    Kind Regards
    Eva

    Hi Dovi,
    I had a look at your application and can see the link your using for the kids and tech fields modal isn't passing the session ID which is why it is asking you to log in again.
    Below is an example URL for your issue, it isn't tested though.
    f?p=&APP_ID.:20:&APP_SESSION.:::19:P20_EMP_ID:&P19_EMP_ID.:: You will need to change the page numbers of the pages and items to match the page numbers of yours. This is using the statically defined url inside the plugin itself, I have also only done this in an earlier version of plugin but believe the functionality is very similar.
    Hope this helps.
    Paul

  • Skillbuilders modal plugin

    Hi!
    I am trying to trigger Notification plugin on Skillbuilders autoclose Modal plugin. It works. But, I would trigger it only when success message is "Insert successful!".
    I made dynamic action, Event is Auto Close and action is Notification plugin. And there I would like to set condition to fire only when success message is equal to something.
    Success message is being hold by
    <div id="MESSAGE" class="t16success">What should I put in condition?
    Thanks!

    Alright, use
    this.data && this.data.$modalPageCloseObject.length!=0 && (this.data.$modalPageCloseObject.text()=="Action Processed.")"this.data.$modalPageCloseObject" is an array. It will contain all the objects matching the given selector. This will probably always be 1 element. I changed the test on the object aswell to check it's length rather than its existence.
    "(this.data.$modalPageCloseObject.text()" does not need the "find" since the object is already that one div.
    <div id="message">...</div>and performing
    $("#messagge").find("div") on it would return an empty array aswell.
    So .find() can be dropped, and just use text on the object.
    If there would ever be more objects in the array you can restrict to, say, the first element by using .eq() on the CloseObject.

  • SkillBuilders modal plugin - Reports will not refresh

    Hi all,
    I'm attempting to use the SkillBuilders Modal Page 2.0.0 plugin, everything seems to work except the refreshing of the reports. When clicking on the links the modal page opens, I can make changes, and after clicking on "apply changes" the modal box closes and I am back at the originating page, however the reports have not refreshed. If I manually refresh the page or the reports - the reports change as expected. I believe my problem is in the Auto Close Dynamic action, but I can't seem to find it. There isn't any errors displayed in the error console either. Any suggestions? Thanks in advance
    SkilBuilders Modal Page 2.0.0 plugin
    Apex version 4.2.1.00.08
    Theme 26 - Productivity Applications
    Page has 3 reports - 2 classic and 1 IR.
    Each report has a link with the class "edit-link"
    Dynamic action (Edit Clicked) is set up with:
    Event: click
    Selection Type: jQuery Selector
    jQuery Selector: a.edit-link
    Condition: No Condition
    Event Scope: Static
    True Actions settings are:
    URL Location: Attribute of Triggering Element
    Attribute Name: href
    Auto-close On Element Selector: section#uSuccessMessage
    Dynamic action (Modal Page Auto Close) is set up with:
    Event: Auto Close [SkillBuilders Modal Page (2.0.0)]
    Selection Type: DOM Object
    DOM Object: document
    Condition: No Condition
    Event Scope: Static
    3 True Actions settings are:
    Action: Refresh
    Selection Type: Region
    Region: "Name of Region"
    Thanks
    Wayne

    Hi Wayne,
    You've got a job on trying to refresh a classic report using the standard dynamic action, it's not as straightforward as simply selecting the region.
    The fastest way to achieve this (unless you MUST have AJAX refreshing of reports) is to change the action of the Auto Close event to Submit Page.
    It's quick and dirty - but it works.
    Hope this helps, cheers, Pete

  • Skillbuilders Modal Plugin Change Theme

    I cannot find a way to change the theme of the modal window.
    I looked in the plugin custom attributes. There is one called Theme,
    but you cannot change anything.
    Anybody know how to do this ?
    Gus

    Hi GusC,
    If I am not wrong, starting from Apex 4.2, you have to go to Shared Components >> Components Settings, and select the SkillBuilders Modal Page Plug-in in order to change the Theme.
    I hope this helps.
    Thank you,
    Erick

  • Skillbuilders modal Popup loading issue??

    Hi All,
    I have implemented skillbuilders modal plugin in my Application.We have some six different region in the home page.Each region is having a create and edit button.
    In the report region,when i click edit icon against each record and modify some values and click apply changes,changes are getting reflected in the home page.When am trying to click the same record,popup is loading continuosly for 4 -5 mins,not opening the form,then i close the popup and refresh the page,again i clicked on the same record which i modified recently ,its opening quickly.
    If anyone faced the same issue ,please post your comment like how you resolved that issue!!
    It will be very helpful for me.
    Many thanks
    Ramya

    Hi Dan,
    Thank you very much for the response.
    I have created a sample demo in apex.oracle.com.
    Please find the link below
    http://apex.oracle.com/pls/apex/f?p=4000:1500:2180107774088701:::::
    Workspace name - newrmo
    username/pwd - DAN/abc123
    DEMO APPLICATION - 66096
    Please check the report region in page 27.
    Try to create a record in that report region and also try to edit the report and click on the show icon to view the record details.
    Thanks,
    -Ramya.

  • Skillbuilders Modal Example Application

    Does anyone has an example application using Skillbuilders Modal Plugin? Preferably an export file.
    I am aware of the webinar, so there is no need to reference it.

    Lorenzo Borges wrote:
    Does anyone has an example application using Skillbuilders Modal Plugin? Preferably an export file.
    I am aware of the webinar, so there is no need to reference it.Dear,
    I am not sure what you mean but Daniel McGhan, creator of skillbuilders plugins does always have a demonstration page of his plugins.
    And I think this demonstration is excellent to show you the possibilities. http://apex.oracle.com/pls/apex/f?p=46685:MODAL_PAGE:0:::::

  • I've problems with skillbuilders Modal Page (2.0.0) plugin

    Hi,
    I'm a newbie on Apex. I'm creating an application with APEX 4.2.1 using the plugin Skillbuilders modal page 2.0 to create/edit the form,
    but after I submitted all the information on page2, I'm not able to come back to page1 and also it doesn't appear the message
    "Action Processed."
    Could you tell me why doesn't work or checking my demo application on apex.oracle.com (http://apex.oracle.com/pls/apex/f?p=58394:1).
    The credentials are:
    workspace: draccanelli
    username: [email protected]
    pwd: draccanell1
    Application: DR - Modal
    ID: 58394
    These are the steps I made:
    a) install plugin
    b) change security from ...
    c) create TEST application (DR - Modal) doing these steps:
    Theme used for the application demo: theme 25
    Page1:
    c.1) change some attributes of create button
    Static ID: create-btn
    Action: defined by DA
    c.2) create DA "create": event:click
    selection type: jquery
    jquery selector: #create_btn
    Action: skillbuilders Modal Page (2.0.0)
    URL Location: statically defined
    static URL: f?p=&APP_ID....
    Auto Close on Element: div#success-message
    c.3) change some attributes for report "report"
    Link Attributes: onclick="return false;" class="edit-link"
    c.4) create DA "Edit Modal": event:click
    selection type: jquery
    jquery selector: .edit-link
    Action: skillbuilders Modal Page (2.0.0)
    URL Location: attribute of triggering element
    static URL: href
    Auto Close on Element: div#success-message
    c.5) create DA "Modal Page auto close": event: Auto Close (skillbuilders 2.0.0)
    selection Type: DOM Object
    DOM Object: document
    Action: Refresh
    add another action:
    event: Auto Close (skillbuilders 2.0.0)
    action: execute JavaScript Code
    Code:
    $('#messages')
    .hide()
    .empty()
    .append(this.data.$modalPageCloseObject)
    .slideDown('slow');
    Page2:
    d.1) change template: Popup
    d.2) change branches to the page 102
    Page 102 (Close Modal)
    e.1) create page with no item
    Thanks in advance...
    Davide

    Your auto-close selector is wrong. You probably copied over the default values, and those do not work on theme 25. The template for your popup page is "Popup".
    Looking at the success message subtemplate for the Popup page template:
    <div class="apex_grid_container">
      <div class="apex_cols apex_span_12">
        <section class="uMessageRegion successMessage clearfix" id="uSuccessMessage">
          <div class="uRegionContent clearfix">
            <a href="javascript:void(0)" onclick="apex.jQuery('#uSuccessMessage').remove();" class="uCloseMessage"><span class="visuallyhidden">#CLOSE_NOTIFICATION#</span></a>
            <img src="#IMAGE_PREFIX#f_spacer.gif" class="uCheckmarkIcon" alt="" />
            <div class="uMessageText">
              <h2 class="visuallyhidden">#SUCCESS_MESSAGE_HEADING#</h2>
              #SUCCESS_MESSAGE#
            </div>
          </div>
        </section>
      </div>
    </div>Your auto close selector would be
    section#uSuccessMessageDon't use .apex_grid_container and also not .apex_cols apex_span_12
    These are classes also used for the body and are not reserved to only the success message.
    However, your auto close action will not work too. Again, you probably copied over the default values, but it won't match with the page template. There is no #messages container to append to. Again, look at the page template for page 1, success message subtemplate, which is the same code as above.
    Not home yet. Since the auto-close selector will only fetch the success message section tag, we can't just insert that in the parent page if there is no div container for it yet. First test for the existance of a success message region, and if not, add the containers. Note that this is very template specific!
    Looking at the page template body code:
    <div id="uBodyContainer">
    #REGION_POSITION_01#
    #SUCCESS_MESSAGE##NOTIFICATION_MESSAGE##GLOBAL_NOTIFICATION#
    <div id="uOneCol">
      <div class="apex_grid_container">
        <div class="apex_cols apex_span_12">
          #BOX_BODY#
        </div>
      </div>
    </div>
    </div>The success message can be inserted before div#uOneCol.
    Annoyingly, notice the onclick code of the uCloseMessage link. This will not be copied over, meaning that the success message will be there, looking pretty. Very annoying. So we'll bind for that.
    This will go into the auto close execute javascript:
    if($('section#uSuccessMessage').length){
       $('section#uSuccessMessage').parent().html(this.data.$modalPageCloseObject)
    }else{
       var newContainer = $('<div class="apex_grid_container"><div class="apex_cols apex_span_12"></div></div>');
       newContainer.find('div.apex_cols').html(this.data.$modalPageCloseObject)
       $('div#uOneCol').before(newContainer);
       $('a.uCloseMessage').click(function(){$(#'uSuccessMessage').remove();});
    };In the end, i only had to adjust the auto close selector and the auto close javascript code.
    Edited by: Tom on Dec 19, 2012 9:51 AM: forum ate my code but my CTRL+C skills nailed it.

  • APEX 4.2. - SkillBuilders Modal Page plugin not sizing fields or labels

    I recently migrated from 4.1 to 4.2, bringing over the Skillbuilders plugin 2.0.0. My page has a Popup template. When I open the page as a Skillbuilders Modal Page, all of the fields have the same width, ignoring the width I've given it with the label above the field, even though I said the label should be aligned left horizontally. If I run the page as itself (not called as a Skillbuilders popup), it properly spaces the fields and the labels are aligned to the left. Can someone help me fix this issue?
    Thank you!

    Johnny98,
    Yes, the plug-in has been known to have issues with the responsive theme. I recommend either changing your theme or avoiding the plug-in for now.
    I may be able to address this in the future, but I wouldn't bank on it.
    Regards,
    Dan
    blog: http://DanielMcghan.us/
    work: http://SkillBuilders.com/APEX/

  • Skillbuilders modal page plugin

    Hi!
    Is it possible to implement modal inside another modal? I am using Skillbuilders modal page plugin 2.0, APEX 4.0.2. version.
    If it is, can someone explain how in short notes...
    I have a form in modal, which would have a create button to open another form in modal, pass values there and submit, and then go back to parent modal. I tried to implement it and it not works
    By the way, I use APEX 4.2 at home and plugin is working great on all themes that I tried. But now, on other computer I am using 4.0.2 APEX and with theme 16 I have some problems with size. E.g. the form width is big. I tried everything... Also tried fixed modal size. Looks good, but the problem is when error message appears then it is not resized automatically and you cannot see whole content. Maybe someone have solution for this... I will put it online when I get.
    Thanks!

    Hi Spooky,
    This is not currently possible, but it's on the list of enhancements. Hopefully it will not be too difficult.
    Regarding older versions of APEX, I've had those issues too. There's an older version of the plug-in, use jQuery Dialog over Colorbox, that works better. If you email me directly I'll send you a copy of the older version.
    Regards,
    Dan
    blog: http://DanielMcghan.us/
    work: http://SkillBuilders.com/APEX/

  • Skillbuilders modal page plugin query

    Hi Guys,
    I have downloaded the Skillbuilders modal page plugin and it works very well for 99% of the scenarios that we have encountered.
    We have one page which needs a slight modification from the standard functionality with regards the modal plug in..
    We have a tabular form which has a field into which we have created our own button (which is used as a link to page 6) with the following syntax:
    *<input id="modal" type="button" value="comps" onclick="javascript:redirect('f?p=&APP_ID.:6:&SESSION.::NO::P6_JOB_RESP_ID,P6_RESPONSIBILITY_ID:#Comps#,#Responsibility#')" />*
    which calls another page within the application and passes in the #Comps# and #Responsibility# values from the current row in the tabular form.
    What I am trying to do is to use the modal page plugin within this tabular form functionality so that the new page (page 6) appears as a modal page.
    The part that is confusing me is how to pass the #Comps# and #Responsibility# values in the tabular form into the plug in as parameters so that the new page appears modal.
    If anyone else has experience using this plugin, any advice would be great.
    Chris
    Edited by: Cashy on 23-Feb-2012 01:22

    Hi Jieri,
    The problem is how you are generating the link. You're using substitution string syntax in the link to refer to an item's value. This will work only on page load. You need something more dynamic.
    For some reason I was able to log in yesterday but I was short on time. Today I tried and the login failed. Try to do this on your own...
    1. Create a hidden item on the page (not protected).
    2. Reconfigure the dynamic action to respond to the click event on that hidden item.
    3. Reconfigure the plug-in to grab the link using an attribute of the triggering element. The attribute can be something like "data-href".
    4. Reconfigure the button to so that clicking the button executes some JavaScript that does two things:
    a) Sets the data-href attribute of the hidden element to the correct value for the link
    b) Triggers the click event on the hidden element
    If you need more help from me on this please unlock that account. Also, I don't know when I'll be able to get to this so please be patient. You can always email me the password if you want to keep it private.
    Regards,
    Dan
    blog: http://DanielMcghan.us/
    work: http://SkillBuilders.com/APEX/
    twitter: https://twitter.com/dmcghan

  • Skillbuilders modal page plugin problems in Apex 4.1

    Hi,
    I have applied the Skillbuilders modal page plugin in my application. Everything works fine except that when I close the popup window - my parent window is not getting refreshed.
    I have put the dynamic action - Auto Close modal and action as - Refresh report on parent page.
    Settings:
    Event : Auto Close [Skill Builders Modal Page]
    Selection Type : DOM Object
    DOM Object: document
    No condition
    Any help much appreciated.
    Thanks,
    Jas

    Dear Dan,
    I have the same problem, the main report is not refreshing after adding or editing values and the success message is not showing after the DA taking place and closing the modal.
    another problem i am facing with oracle cloud which is when is when the modal loads, it gives me the following error :
    Sample Database Application
    [email protected]
    An unexpected internal application error has occurred. Please get in contact with your system administrator and provide reference# for further investigation.
    Technical Info (only visible for developers)
    is_internal_error: true
    apex_error_code: APEX.SESSION_STATE.SSP_CHECKSUM_MISSING
    error_backtrace:
    ----- PL/SQL Call Stack -----
    object line object
    handle number name
    0x32c6b06c8 548 package body APEX_040200.WWV_FLOW_ERROR
    0x32c6b06c8 599 package body APEX_040200.WWV_FLOW_ERROR
    0x32c6b06c8 903 package body APEX_040200.WWV_FLOW_ERROR
    0x32ca89608 5985 package body APEX_040200.WWV_FLOW
    0x32df51ac8 249 procedure APEX_040200.F
    0x29cd0a0d0 2 anonymous block
    Set Screen Reader Mode On 4.2.1
    and after googling , i saw your solution for the super lov having the same problem
    problem located in customers page.
    the credentials are:
    http://apex.oracle.com/pls/apex/f?p=4000:1:9039832809236::NO:RP:FB_FLOW_ID,F4000_P1_FLOW,P0_FLOWPAGE,RECENT_PAGES:37403,37403,37403;|,
    workspace: ahk
    username : dan
    password : dan
    Best Regards:
    Yousef Alraway
    Edited by: user12279113 on Mar 12, 2013 3:25 PM

  • Skillbuilders Modal Page Plugin - Help in setting Modal window height/width

    Hello Apex Experts,
    I have downloaded the Skillbuilders Modal Page Plugin. I have tried to implement the same but my modal window is not showing correctly. I can see all the fields and scroll bar. I also tried to set the initial height/width settings but no luck.
    Can anyone help me?
    Your help would be appreciated.
    FYI: I'm using Apex v4.2 on Google Chrome.
    Many Thanks,
    Bhavin

    Bhavin,
    Go into the setting in the Shared Components for the plug-in and change the theme from custom to a number (1-5). Also, make sure to read this:
    http://www.danielmcghan.us/2011/08/new-browser-security-attributes-in-apex.html
    Regards,
    Dan
    blog: http://DanielMcghan.us/
    work: http://SkillBuilders.com/APEX/

  • Problems with Apex4.2, SkillBuilders Modal Page plugin, IE9 and HTML5 theme

    Hello everyone.
    Please Help.
    Again problems with Apex4.2, SkillBuilders Modal Page plugin, IE9 and HTML5 theme (Blue Respensive).
    1. The problem is that all the popup windows display 100% of the width
    2. After opens a popup window change the width of the parent window forms.
    This happens only in IE9 browser.
    In other browsers, the popup window only much larger than the form that is opened.
    I can not change the size of the window.
    Thanks.

    Milk,
    I changed the component level settings to use a fixed height and width (I adjusted edit, you still need to adjust create). You can try adjusting this some because the modal page should adjust a bit.
    Then I added this CSS to the Inline CSS of the modal page:
    section.uMessageRegion{position: static; !important;}
    Let me know how this works for you.
    Regards,
    Dan
    blog: http://DanielMcghan.us/
    work: http://SkillBuilders.com/APEX/

Maybe you are looking for