jQuery Forum

Which version of jQuery & jQuery UI are you using? Are you using a theme from a CDN?

Thank you, for your response.

I see only this reference in our entire project:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

I don't see it with 1.9.2  or 1.9.1 http://home.jejaju.com/play/showPopup

JΛ̊KE

Jake, I understand that it works for you using my code, but do you know what could be possible contributor(s) to the delay on my side?

Bad wifi, bad proxy server,… All sorts of stuff, none of which are under control of jQuery.

Your test page works just fine on my iPad.

My page that is experiencing the delay is a portal page with several elements on it.
There is a button (in bold below) that is under a <div>, like this:

<div id="suspendedFlows_<portlet:namespace/>" >
  <div id="loadingCaption">Retrieving Suspended Workflows, Please Wait...</div>
  <div id="caption" style="display:none;">Select a workflow below to resume a suspended flow.</div>
   
  <table id="listSuspended">
  </table>
                                 
  <div id="startNewFlowDiv">
      <button id="startNewFlowButton" name="startNewFlowButton"
              class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
              role="button" aria-disabled="false" style="display:none;">
                  <span class="ui-button-text">Start New Workflow</span>
      </button>
  </div>
</div>.

Then that outer <div> is assigned to the context:
portletContext_<portlet:namespace/>.suspendedFlows='${portletSessionScope.suspendedFlows}';.

After that there is a variable that is assigned a new constructor call with that context in the js file.
and a call to the init().

Under the init() there is the following:
startNewWFButton.bind('click', showPopup);.

After that is the code that I provided in my original post.

Could it be something in the ui definitions that we use?

portletContext_<portlet:namespace/>.suspendedFlows='${portletSessionScope.suspendedFlows}';.

is some server code. Does it generate HTML?

Sorry, I listed incorrect line of code in my last post.

Instead of this line
    portletContext_<portlet:namespace/>.suspendedFlows='${portletSessionScope.suspendedFlows}';

it should have been this:
    portletContext_<portlet:namespace/>.rootElement='suspendedFlows_<portlet:namespace/>';
.

so from that rootElement we find #startNewFlowButton and bind the click event to the showPopup().

I hope this clarifies my previous post.

It does not. You are posting in some language that I do not recognize.

JΛ̊KE

Sorry. Let me try to clarify it with a little more structure and details.

Here is the content of the jsp file that pertains to the button to which dialog is tied:

<div id="suspendedFlows_<portlet:namespace/>" >
                                 
  <div id="startNewFlowDiv">
      <button id="startNewFlowButton" name="startNewFlowButton"
              class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
              role="button" aria-disabled="false" style="display:none;">
                  <span class="ui-button-text">Start New Workflow</span>
      </button>
  </div>
</div>
***************************************************************************************************
<script type="text/javascript">
    portletContext_<portlet:namespace/>.rootElement='suspendedFlows_<portlet:namespace/>';

    var resumeWFPortletProcessor_<portlet:namespace/> = new ResumeWFPortletProcessor(portletContext_<portlet:namespace/>, eventSource);
    resumeWFPortletProcessor_<portlet:namespace/>.init();
</script>
.

Here is the content of the js file where the dialog is defined:

var ResumeWFPortletProcessor = function()
{
    function Constructor(context, pEventSource)
    {   
        var jQueryIdForPortletContentArea = "#" + context.rootElement;
        var startNewWFButton = jQuery(jQueryIdForPortletContentArea).find("#startNewFlowButton");
       
        /* Public function.
         * This function takes care of building the grid/table with the content received for
         * Suspend and resume and binding the appropriate functions to the button click.
         */
        this.init=function()
        {

*****************************************************************************************
            startNewWFButton.bind('click', showPopup);
*****************************************************************************************
        }
*****************************************************************************************
        function showPopup()
            {

        //the dialog code from the original post
        }
    }
    return Constructor;
}();

Is this helpful?

This line is not javascript. I don't speak JSP.

Thank you, for your time, Jake...

Jake, one more question...

I added a third button like this:

                buttons: {
                "NewButton" : function() {
                    $(this).dialog("close");
                },
                "Yes" : function() {
                    $(this).dialog("close");
                    startNewFlow();
                },
                "Cancel" : function() {
                    $(this).dialog("close");
                    $(this).dialog("destroy");
                }
            }.

And now that this third button has the delay, but Yes and Cancel buttons appear with no delay.
It appears to me that the first button in the set is having a delay.

Does this info prompt you for any additional thoughts?

Also, do you think it is possible that the ui definitions could impact the behavior?

I would love to see a live demo of your code that shows the aberrant behavior. I can't guess what is actually going on. 

JΛ̊KE