[Seaside] Request help with JQuery datepicker widget

Sun Jul 3 04:06:54 UTC 2011

Hi,
I can't get the JQuery date picker widget (1) to work and haven't been able to figure out why. By not working, I mean that when I click inside the edit text box, the calendar does not display. I've really tried to figure it out myself but I feel that there's just something I'm not understanding so I feel like I'm floundering. Help!

Within my local Pharo, the JQuery Functional Test Suite (2) version of the Datepicker works just fine, meaning that it shows the graphical calendar for choosing a date.

To minimize affects from anywhere else in my code, on my app's home page, I have a link to show the  JQDatepickerFunctionalTest page.

				html anchor
					callback: [self show: (JQDatepickerFunctionalTest new)];
					with: 'Show JQDatepickerFunctionalTest page'.

The HTML source for that page shows the following (I added  carriage returns in this post to help with readability)

------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><title>Seaside</title><meta http-equiv="Content-Type" content="text/html;charset=utf-8"/><meta http-equiv="Content-Script-Type" content="text/javascript"/>

<script type="text/javascript" src="/files/JQUiDevelopmentLibrary/jQueryUi.js"></script>
<script type="text/javascript" src="/files/JQDevelopmentLibrary/jQuery.js"></script>

</head><body onload="onLoad()">

<input value="09/19/2008" name="1" id="id3" type="text" class="text"/>

<script type="text/javascript">/*<![CDATA[*/function onLoad(){$("#id3").datepicker({"onSelect":function(){$.ajax({"url":"http://127.0.0.1/mag","data":["_s=e4Sq6WTG4JGpL5D1","_k=E7tcZLB_1uw-kFoL","2",$(this).serialize()].join("&")})}});};/*]]>*/</script>

</body></html>
------------------------

I suspect it has something to do with my apache proxy settings, but I don't know much about the interaction between Pharo/Seaside URL generation and navigation besides that it allows me to not specify the port in my browser. 

        ProxyPass /mag       http://localhost:8085/mag
        ProxyPassReverse /mag       http://localhost:8085/mag

# 2011-0701 MAG - these lines help Pharo get to its JQuery files
    	ProxyPass /files       http://localhost:8085/files
        ProxyPassReverse /files       http://localhost:8085/files

        ProxyPass /javascript       http://localhost:8085/javascript
        ProxyPassReverse /javascript       http://localhost:8085/javascript

----
Also, the Seaside app's ...
... serverPath is set at '/mag'
... serverHostname is set at  '127.0.0.1'
As given by the folowing:

In my Workspace:
	magApp := WADispatcher default handlerAt: 'mag'.
	(magApp configuration expressionAt: #serverPath ifAbsent: [nil]) value.  "print-it = '/mag'"
	(magApp configuration expressionAt: #serverPath ifAbsent: [nil]) value.  "print-it = '127.0.0.1'"

--- 
Other system configuration:

Pharo1.2.1 Latest update: #12345
Mac OS X 10.6.8 on a 2.66 GHz Intel Core 2 Duo MacBookPro with 4 GB RAM
Seaside Version:	3.0.3
Grease Version:	1.0.3 (Pharo)
JQuery-Core	lr.112
JQuery-Tests-Core	lr.125
JQuery-Tests-UI	lr.79
JQuery-UI	lr.69
---------

- Marco A.

(1) http://demo.seaside.st/javascript/jquery-ui/datepickerwidget
(2) http://localhost:8085/javascript/jquery-ui/datepickerwidget