Looks like the JavaScript isn't actually being loaded. You can confirm this with Firefox developer tools or equivalent for your browser of choice. Most likely this is a path issue; what directory did you put the jQuery UI source in?

I use jQuery UI in a Dancer2 app. I used the dancer2 command line utility to set up the directory structure, so I have:

myapp/

lib/

myapp.pm

public/

javascripts/

jquery.js

jquery-ui.js

myapp.js

views/

index.tt

layouts/

main.tt

...

I load all my JavaScript in the main layout (views/layouts/main.tt), something like this:

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" />
    <link rel="stylesheet" href="[% request.uri_base %]/css/style.css" />

    
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js" type = "text/javascript"></script>
    <script type="text/javascript">/* <![CDATA[ */
        !window.jQuery && document.write('<script type="text/javascript" src="[% request.uri_base %]/javascripts/jquery.js"><\/script>')
    /* ]]> */</script>
    <script type="text/javascript">/* <![CDATA[ */
        !window.jQuery.ui && document.write('<script type="text/javascript" src="[% request.uri_base %]/javascripts/jquery-ui.js"><\/script>')
    /* ]]> */</script>

    <script src="[% request.uri_base %]/javascripts/myapp.js" type="text/javascript"></script>
</head>
<body>
      [% content %]
</body>
</html>

Two things to note: first, I use the template parameter 'request.uri_base' to get an absolute URL to the base of the application (which points to the public/ directory); second, I only use my local copy of jQuery if I fail to get it from Google's CDN.

I create an HTML <input> element for my datepicker in views/index.tt:

<input type="text" id="datepicker">

And the JavaScript to create the datepicker is in public/javascripts/myapp.js, something like:

$(function() {
    $('#datepicker').datepicker({
        dateFormat: $.datepicker.ISO_8601,
        maxDate: 0,
        changeMonth: true,

        changeYear: true
    });
});

(I haven't tested the above but it's essentially what my app does)

On Wed, Jun 11, 2014 at 7:59 AM, Sullivan Beck <sbeck@cpan.org> wrote:

I've using Dancer 1.3115 on OpenSuSE 13.1. I've downloaded jquery 1.11.1 and the datepick plugin from http://keith-wood.name/datepick.html.

I took the simplest test script from the datepick home page (and stripped it down to a single popup calendar -- that's the functionality I want) and put it in a very simple Dancer script. Unfortunately, although the HTML produced is correct, the Dancer script isn't working.

When I run the dancer script and point my browser at it, I see a text box asking for a date. If I click in the box, no calendar pops up to select the date.

If I view the page source and copy the html into a dancer2.html file and open that file up in my browser and it works great. I see the same page, and clicking in the box pops up the calendar.

I'm a fairly recent user of Dancer, but I'm really liking it and want to use it for a project but I really need the datepicker to work.

Any suggestions?

I'm attaching the dancer2.pl script and the HTML it generates. My setup is that I have dancer2.pl and dancer2.html in a directory and a subdirectory jquery containing both jquery and the datepicker plugin (both completely unmodified).

_______________________________________________
dancer-users mailing list
dancer-users@dancer.pm
http://lists.preshweb.co.uk/mailman/listinfo/dancer-users