Workflow Assignment Screen

Hi All,

I wanted to make a popup calendar to allow the user to pick the date on the workflow assignment screen.

when user click on the "select" as shown in the picture below, a popup calendar show up to allow the user to pick from it, and auto populate the value to the textbox.

do anyone have any idea how I can implement this?

*in the DCT I am using cgi-callout to call the perl script (the attachment - new_calendar.ipl) and render the popup calendar, I not sure the workflow configuration file is supporting cgi callout or not.

Find more posts tagged with

Comments

ISCBorisB

*in the DCT I am using cgi-callout to call the perl script (the attachment - new_calendar.ipl) and render the popup calendar, I not sure the workflow configuration file is supporting cgi callout or not.

Currently WF Instantiation Form does not support FormAPI. So, you are limited to plain vanilla JS coding.

That said, what you want is easy to do. You can inject your JS script(s) into WF Instantiation Form using
CGI_info directive (pre_tagtable_html and post_tagtable_html) properties. Then it's a simple matter
of referencing your own "onclick" handler from TAG_info that in turn will call your cgi and set required Form element.

You may want to take a look at the sample I gave in [thread=8584]this thread[/thread]. Note that thread topic is
unrelated to your issue, it just shows CGI_info usage to incorporate your own JS

waikong


if ($ask_for_due_date) {
    TAG_info(
       iw_due_date  =>  
           [ html        => "<SCRIPT LANGUAGE='JavaScript' src='../../custom-script/dev/CalendarPopup.js'></SCRIPT><SCRIPT LANGUAGE='JavaScript'>var cal = new CalendarPopup();</SCRIPT>Popup Calendar",
             label       => $localizer->format('due_date_label'),
             error_msg   => $localizer->format('due_date_error_msg'),
             is_required => 'false',
             valid_input => '/\d\d\d\d\-\d\d\-\d\d/',
           ],
    );
}

ISCBorisB

[QUOTE=waikong]


if ($ask_for_due_date) {
    TAG_info(
       iw_due_date  =>  
           [ html        => "<INPUT TYPE='text' NAME='date1' VALUE='' SIZE=10><SCRIPT LANGUAGE='JavaScript' src='../../custom-script/dev/CalendarPopup.js'></SCRIPT><SCRIPT LANGUAGE='JavaScript'>var cal = new CalendarPopup();</SCRIPT><A HREF='#' onClick='cal.select(date1,'anchor1','MM/dd/yyyy'); return false;' NAME='anchor1' ID='anchor1'>Popup Calendar</A>",
             label       => $localizer->format('due_date_label'),
             error_msg   => $localizer->format('due_date_error_msg'),
             is_required => 'false',
             valid_input => '/\d\d\d\d\-\d\d\-\d\d/',
           ],
    );
}
Personally, I like to separate all my JS and leave just pure html *onEvent* reference in the TAG_Info html properties.
It's easier to maintain and (re)use. It is also easier to convert to js library if you find that you are using same code in multiple 
wft's, dct's, cgi's and whatnot

waikong

I got this code, which I believed it should be working on workflow assignment screen.

[html]
# Add the due_date field to the form if it has been activated.
if ($ask_for_due_date) {
my $javascriptcode = "<script language='JavaScript'>function open_calendar(){window.open('/iw-bin/z_calendar_wft.ipl','false','width=230px,height=250px,left=250,top=250,titlebar=no,status=no,resizable=no,toolbar=no,menubar=no,location=no,scrollbars=no');}</script>\n";

#date control
my($duedate_html);
$duedate_html = $javascriptcode.$duedate_html;
$duedate_html .= "\n\t";
$duedate_html .= "

\n\t";

TAG_info(
iw_due_date =>
[ html => $duedate_html,
label => "Due Date",
error_msg => "Please specified a due date",
#valid_input => 'validDate($_)',
is_required => 'false',
],
);
}
[/html]

The code above produces the following screen
(noted the calendar besides the Due Date field)

but when I click on the calendar icon, and it actually popup an error windows looks like this:

The error message:

Internal Server Error
The server encountered an internal error or misconfiguration and was unable to complete your request.
Please contact the server administrator, and inform them of the time the error occurred, and anything you might have done that may have caused the error.

More information about this error may be available in the server error log.

--------------------------------------------------------------------------------

Apache/1.3.31 Server at 10.2.1.123 Port 80

At first I tot it was Apache error, then I go and check the iw-home/iw-webd/logs/error.log, it was not updated, so then I think it wasn't Apache error...

I have also run a the test on the perl, and it returns a sets HTML table code which looks like a table of calendar, and I assume that is not the perl script error as well...

but then, where should I start looking for now? I am lost, can someone please enlighten me.

nipper

How are you invoking the IPL ? I did not see that command.

Andy

ISCBorisB

Your posts indicate that you are trying to implement the following Calendars for
WF Instantiation:

12/20 Robert Huffstedtler's "new calendar"
12/21 Some custom "CalendarPopup.js", only you may know the origin of it.
12/26 z_calendar_wft.ipl - Hard to tell what that is, my guess is that's
the old IWOV's "z_calendar" modified and/or renamed by somebody.

Please note that:
a) It helps to make up your mind.
b) Providing that 1,2,3 above work, either one of them can be used for WF
c) Obviously your WF code will differ for different Calendars

I would recommend to pick the calendar you are already using in DCTs. Advantages
are that you know an API, you know it works and you will have to maintain only one calendar.
Try to make it work for wft. Post your issues and code if you need help.

waikong

Your posts indicate that you are trying to implement the following Calendars for
[highlight]WF Instantiation:[/highlight]

12/20 Robert Huffstedtler's "new calendar"
12/21 Some custom "CalendarPopup.js", only you may know the origin of it.
12/26 z_calendar_wft.ipl - Hard to tell what that is, my guess is that's
the old IWOV's "z_calendar" modified and/or renamed by somebody.

Please note that:
a) It helps to make up your mind.
b) Providing that 1,2,3 above work, either one of them can be used for WF
c) Obviously your WF code will differ for different Calendars

[highlight]I would recommend to pick the calendar you are already using in DCTs. Advantages
are that you know an API, you know it works and you will have to maintain only one calendar.
Try to make it work for wft. Post your issues and code if you need help.[/highlight]

Yeap, I agreed with you, and apologize with my confusing post, because I am quite new to TeamSite and there are things that I feel uncertain can be done. so I end up keep on looking for different solution.

...

anyway, I get that calendar work by using the [highlight]z_calendar_wft.ipl[/highlight] and the and the code I posted in my previous post.

and then I try to switch the perl script, which means use back the [highlight]new_calendar.ipl[/highlight], and I did some modification on the javascript part. then everything works fine (because the script i use in DCT, they specifically fill the date to DCT element, and the z_calendar_wft.ipl is specifically fill up the field at the [highlight]WF Instantiation[/highlight] page.)

Combining
so now lets talk about combine...

I got 2 solution in my mind, just hope some of you expert to share your opinion with me, which you feel better or any potential risk of doing so. or maybe you can suggest any better solution Smiley Very Happy

Solution 1: Parameter control
1 perl script, but I modify the setDate() function (the function that populate the DCT/workflow date field) so that it accept parameter and when i call the perl script, I pass in the parameter to tell the script that I am calling from DCT or calling from WF screen.

Solution 2: File reference
2 perl script, but I code the identical part of the calendar (e.g. the html part, and the css part) into a text file, and the setDate() function code in the perl script, then I refer the text file in both perl script.

Adam Stoller

Combining
so now lets talk about combine...

I got 2 solution in my mind, just hope some of you expert to share your opinion with me, which you feel better or any potential risk of doing so. or maybe you can suggest any better solution

Solution 1: Parameter control
1 perl script, but I modify the setDate() function (the function that populate the DCT/workflow date field) so that it accept parameter and when i call the perl script, I pass in the parameter to tell the script that I am calling from DCT or calling from WF screen.

Solution 2: File reference
2 perl script, but I code the identical part of the calendar (e.g. the html part, and the css part) into a text file, and the setDate() function code in the perl script, then I refer the text file in both perl script.

Solution 1 would probably be my preference in this case, but either is fine as long as you document it thoroughly (so that the next person who comes along to work on the code doesn't have as hard a time as you did with it).

ISCBorisB

If I were you, I would go with the (slightly) modified *Solution One* idea.

Remove setDate() from the script alltogether and use it as a callback function instead. Then code one
setDate in your FormAPI and another in WFT (and yet another anywhere you will need your Calendar in the
future :-). Please note that for FormAPI you'll have to use getScriptFrame function to find your callback
Quick and dirty, something like the following


var api;
var FapiFlag = true;

try {
   api = window.opener.parent.getScriptFrame();
}
catch(err) {
   FapiFlag = false;
}

if ((FapiFlag) && (api != null)) {
   api.setDate(new_date);
}
else {
   window.opener.setDate(new_date);
}

With this approach your ipl stays unchanged and varios *setDate's* are located where they belong with the
local knowledge of what to change and how to change it.