I'm new to php/javascript so I don't really understand how to do this. I want to add a pop-up calendar to an input form on a drupal page. I have written the form in html with php commands to $_POST the values from the form to a database. Now I just want to add the calendar to the text box for dates.

e.g.
<input type='text' name='start_date'>

I tried adding the code as described in the readme file to my page:

  $form['date'] = array(
    '#type' => 'textfield',
    '#attributes' => array('class' => 'jscalendar')
  );

I also tried adding class='jscalendar' to my form tag but that doesn't change anything either. Clearly there is more to it. Could someone please provide an example of a page with a form on it that uses jscalendar popups?

[ jstools module is uploaded and jstools and jscalendar are enabled. Drupal version 4.7.3. Downloaded jstools today. ]

thanks
Bill.

Comments

billtubbs’s picture

billtubbs commented

For those interested here is a response I got from one user:

Here is how I added jscalendar to a Date field in all node forms:

function [my_module_name]_form_alter($form_id, &$form)
{
// Attach calendar to all authored date fields
if (!empty($form['author']['date'])) {
$form['author']['date']['#attributes'] = array('class' => 'jscalendar');
$form['#jscalendar_ifFormat'] = '%Y-%m-%d';
$form['#jscalendar_showsTime'] = 'true';
}
}

oemb29’s picture

oemb29 commented

Sorry but I cant understand....

Wher is "all node forms"?

aaustin’s picture

aaustin commented

In case the hook_form_alter stuff is confusing to anyone.

If you're just adding a simple date field to a form, you can do something like this:

$form['date'] = array(
  '#title' => 'Date completed',
  '#type' => 'textfield',
  '#description' => t('Date that you finished reading the book'),
  '#attributes' => array('class' => 'jscalendar'),
  '#jscalendar_ifFormat' => '%m/%d/%Y',
  '#jscalendar_showsTime' => false,
  '#jscalendar_timeFormat' => '24',
);
modul’s picture

modul commented

Sorry to bother you, but could you give me the rest of the form code also? I would like to include the code provided by aaustin in a node with php code, but I don't have a clue on how to this. I'd be really helped a lot if someone could write the complete form code. The idea is that the result of clicking something on the Jscalendar could be put in a $variable, to be used in code further down the node.

Thanks!!

clivesj’s picture

clivesj commented

The #1 example is the way to go if you like to edit your .tpl file.
If yoy just need a form on your page:

<?php

  $output .= drupal_get_form('myform');
  return $output;
 
//  Function that creates myform
 
 function myform() {
   $form['date_field'] = array(
     '#type' => 'textfield',
     '#title' => 'Date completed',
     '#description' => t('Date that you finished reading the book'),
     '#attributes' => array('class' => 'jscalendar'),
     '#jscalendar_ifFormat' => '%m/%d/%Y',
     '#jscalendar_showsTime' => false,
     '#jscalendar_timeFormat' => '24',
  );
  return $form;
}
?>

Create a node and paste this code into the body field.

modul’s picture

modul commented

Thanks for your working example, Clivesj!! It works like a charm.

There's one thing I don't understand, though, and that's the "return $output" part. Return "what to what"??

And you'll scold me for not having grasped the first bit about Drupal forms (and you'd be correct to do so...), but, based on your code, how could I stuff the result, i.e. the date picked, in a variable?? I suppose some sort of "Submit" thingy is required to do this, but how?? Sorry for bugging you on this...

clivesj’s picture

clivesj commented

Ahum..,
Yes I'm afraid you definitly will have to take a look at the drupal form.api's or -even better-
get yourself the drupal book: Pro Drupal Development. There is a whole chapter dedicated to forms (You can purchase the e-book at apress.com). And even then you will have to browse drupal.org to get the complete picture.
The way Drupal handles forms is a bit different than you are problably used to in straight HTML.
If you don't want to jump into the deep consider alternatives:

1. Use webforms (module webform)[does NOT support JS datapicker!], or better:
2. Make your forms by using CCK, Workflow and Action module.
Both methods are achieved without have the need to program anything.

But if you want to stick onto builiding forms yourself:
Besides the function myform // creating the form
you will will need the submit function the get your form values and process them:

<?php
function myform_submit($form_id, $form_values) {
  $your_date = $form_values['date_field'];
               // do something with the value retrieved, in this case display a message
  drupal_set_message('your date : ' . $your_date);
return FALSE;
}
?>

If you need validation of the input you will also need
function myform_validate.

modul’s picture

modul commented

Thanks again for the help, Clivesj, and yes, of course you're right that I should study the Forms API, as I am doing right now. But you know what is missing, not only there, but so often in the Drupal manuals? Reeeealllll simple but practical examples. After studying your example, and after having found this - http://drupal.org/node/126261 - I saw the light, and I have already made 3 quite different forms today. If you're accustomed to hardcoding forms in HTML or generating them through PHP, the Drupal approach, is, well, very different. And it's exactly that difference which doesn't get enough attention in the handbooks. Maybe I should write a page like that myself, something like "Very basic things you used to do in HTML/PHP, but which you now want to do in Drupal". I'm sure lots of people would be interested in something like that. The Forms API, for instance, is quite easy to follow once somebody tells you how to fire up a form in practice. Filling those form arrays isn't all that hard, but its the reeeeaalll basics which are not there.

Anyway, I once again thank you for all your information, which helped me with 99 % of the form basics. A small stroke of luck added that missing 1 % :-)