subModal()

Help for using specific functions

subModal()

Postby PetrH » Wed May 07, 2014 8:55 pm

Hi there,

I am using the subModal() function to open a web page in which I have a form and a submit button. When the user fills out the form and clicks submit, the page correctly submits the information to the server, but the subModal window remains open. I'd like to close the subModal window when the submit form on my page is clicked, or perhaps after the form is submitted and the user is shown a different page. Is there any way to close the subModal window from a web page shown as a modal dialog? Presently, the only way to close the subModal dialog is to click the red X in the dialog.

Thanks,
Pete
Peter
Always available for Toolbook work.
[email protected]
PetrH
 
Posts: 22
Joined: Mon Jan 20, 2014 11:29 pm

Re: subModal()

Postby Clifton » Thu May 08, 2014 6:23 am

The PowerPac provides full function support for third-party web pages via a little script that you add to the <head> section of the form page. The script is located in the [dialog] folder and is named com_link.js. The com_line.js file provides all the services of PowerPac's function pgExecuteRemote() for third-party pages. Among the many services provided is the ability to automatically close a subModal() popup window.

Here is a very simple web form that I put together to illustrate how to close a subModal() popup from a form submission of a third party page.

Code: Select all
<!DOCTYPE html>
<html>
<head>
<meta name="date" content="2014-03-30T06:38:29+00:00">
<title>Test Web Form</title>

  <!--COMMENTS AND NOTES:

  1. ADD script "../dialog/com_link.js" to head section of page.
     The script provides the full range of support for the
     PowerPac function pgExecuteRemote() when enabled
     bi-directional communication with the ToolBook content.

  2. Whenever communication is required back to ToolBook in the
     main window, call the function pgExecuteRemote().

  3. Example:
     To automatically close the subModal() popup in
     which a webform.html page is displayed, use the following
     syntax for you submit button:
        onclick="var args={ objectList  : '',
                            userValues  : '',
                            closePopup  : true };
                pgExecuteRemote( 'setModalReturnVal', args );"

  GENERAL NOTES FOR CALLING pgExecuteRemote:
  1. Parameters:
      theFunction = string
                    PowerPac function to execute in main window;
                    Example: 'pgTBObjSet' or 'tbfunction_pgTBObjSet'

      args        = string or Array or object/property values
                    Must contain arguments as expected by [theFunction]
                    Array Example:  var args = [ 'My Text Box', 'visible', true ];
                    String Example: var args = 'My Text Box, visible, true';
                    Object Example: var args = { tbName    : 'My Text Box',
                                                myProperty : 'visible',
                                                myValue    : true };
                    Any of the above would work if [theFunction] = 'pgTBObjSet'

      focus_targetWindow = boolean (default = false)

  END OF COMMENTS-->

  <script src="../dialog/com_link.js"></script>

  <style type="text/css">
    body { width:320px; padding-top: 5px; }
    form { margin: 0 auto; }
  </style>
</head>

<body>
<form name='sampleForm' id='sampleForm' action="">
  Enter your name:&nbsp;&nbsp;
  <input id="send_to_tb" name="send_to_tb" style="width:250px;" /><br />
  <input id="sendTextNow" type="submit"
         value="Submit Form"
         onclick="this.blur();
                  var args = { objectList : '',
                               userValues : '',
                               closePopup : true };
                  pgExecuteRemote( 'setModalReturnVal', args );" />
</form>

</body>
</html>

Notice that we have added "<script src='../dialog/com_link.js'></script>" to the head section of the web form page.

THEN, when the form is submitted you can call any PowerPac function in the main window. In this case, to close your subModal() window, we call the PowerPac function setModalReturnVal() and specify that it should close the window by setting the parameter closePopup = true.

You can call any PowerPac function in the main window from a third-party web page using this basic method.
  • You can send data to populate a field by calling pgExecuteRemote() and calling any PowerPac function in the main window that can add or change field content.
  • You can send a user, click, or trigger event to any object by using pgExecuteRemote() to call pgTBObjSet() in the main window.
  • You can remotely manipulate properties of objects (e.g.: enable/disable a button) by using pgExecuteRemote() to call pgTBObjSet() in the main window..
  • You can force navigation to a different page based on user interaction in the third party web page by using pgExecuteRemote() to call gotoPage() in the main window.
  • . . . and the possibilities are endless!!
Of course, you should always update your PowerPac installation as this ability was added to the v11.82.738 and later versions of the PowerPac.
Clifton
Site Admin
 
Posts: 732
Joined: Tue Jan 14, 2014 1:04 am

Re: subModal()

Postby PetrH » Tue May 20, 2014 10:19 pm

This worked perfectly. In my case, the web form page was on the same server but not in the lesson folder structure. So I had to put a copy of the js file in the folder structure of the web site hosting the web form. Then the web form page calls the js file and interacts with the parent window (the lesson window) and automatically closes the dialog... just as advertised. SO much better than the old method I was trying to use.
Thanks Clifton!
Peter
Always available for Toolbook work.
[email protected]
PetrH
 
Posts: 22
Joined: Mon Jan 20, 2014 11:29 pm


Return to Function Help

Who is online

Users browsing this forum: No registered users and 3 guests

cron