Hi,
I'm new in Drupal. I'm trying 3 weeks now to implement to my module one AHAH function,,,,,, like in poll module -> when I click add more button I want add more text fields.
I have found great tutorial on this page http://www.stellapower.net/content/ajax-ifying-drupal-node-forms
Exactly what I need, but this (and poll module) works with nodes. But I want this module without nodes ! I want such module that can be implemented easily to any module / page.
So I'm trying rebuild this module (without nodes). It works, but I can add only one field, another "add more" click will rewrite the first form field.
Problem is probably that $node->tracks don't work like a global variable in my case. So I need another global variable, but I don't now how.
You can download my remake of this module here: http://rapidshare.com/files/293062181/test.zip
I realy need it for my school project.
If somebody has something similar what I need I will be very thankfull. Or look my module how can I fix this problem.
Thank You Very Much
(and sorry for my english)
Comments
ahah_helper module is what you need.
the ahah_helper module is what you need. It will take care of all the necessary work for AHAH stuff. there are some great tutorials on google.
http://drupal.org/project/ahah_helper
AHAH Helper
Ahah helper looks great but has almost none documentation and I can't find more demos. If somebody has some usefull demos I will be thankful.
I can't find any working module for Drupal where is dynamically "add more" form. I'm sick of that.
I think my problem is, thah I need some (global) variable - where can I store how many fields has been added in my page.
When using simple html with ajax (add more field functionality),, this variable is stored localy in my browser, but when I'm using AHAH.....I don't know how to implement this counter. (In poll module is $node->counter ,,but I don't use nodes).
what are you using to build your forms?
Are you using code via the Forms API or are you using CCK or webform module?
I'm developing new module via
I'm developing new module via Forms API (I think).... I have some tables in Drupal database for my module. When I click for example on url mymodule/add_info
forms user name, description,,etc will display. Here I need implement this dynamically add form functionality.
Then after clicking save button "mymodule_submit" function is called and all info is stored into module tables in drupal database.
I don't use CCK. I think CCK is working with nodes.
ahah tutorial
I've been using the ahah_helper
http://wimleers.com/blog/ahah-helper-module
give a short tutorial on how to use the module. The ahah_helper takes care of registering all the AJAX callbacks etc.
the objective of the ahah_helper module is take care of the backend drupal work to getting AHAH working. The way ahah works with the ahah_helper modules is as follows.
Anytime a form element is encountered with an AHAH event attached to it,
1. browser will "submit" the form through AJAX,
2. drupal in the backend will process the submission through the ahah_helper module
3. the ahah_helper module will re-process the form
4. since you now have "submitted" form values, you can modify the elements of your form accordingly, add/update/remove/change your form based on the the submitted values.
5. drupal sends back the new form to the browser
6. the browser will dynamically render the new form elements
While the above tutorial does not walk step through step I will try to explain the demo code included with the module
<?php
function ahah_helper_demo_form($form_state) {
$form = array();
// Register the form with ahah_helper so we can use it. Also updates
// $form_state['storage'] to ensure it contains the latest values that have
// been entered, even when the form item has temporarily been removed from
// the form. So if a form item *once* had a value, you *always* can retrieve
// it.
ahah_helper_register($form, $form_state);
// Determine the default value of the 'usage' select. When nothing is stored
// in $form_state['storage'] yet, it's the form hasn't been submitted yet,
// thus it's the first time the form is being displayed. Then, we set the
// default to 'company'.
if (!isset($form_state['storage']['billing_info']['usage'])) {
$usage_default_value = 'company';
}
else {
$usage_default_value = $form_state['storage']['billing_info']['usage'];
}
$form['billing_info'] = array(
'#type' => 'fieldset',
'#title' => t('Billing information'),
'#prefix' => '<div id="billing-info-wrapper">', // This is our wrapper div.
'#suffix' => '</div>',
'#tree' => TRUE, // Don't forget to set #tree!
);
$form['billing_info']['usage'] = array(
'#type' => 'select',
'#title' => t('Usage'),
'#options' => array(
'private' => t('Private'),
'company' => t('Company'),
),
'#default_value' => $usage_default_value,
'#ahah' => array(
'event' => 'change',
// This is the "magical path". Note that the parameter is an array of
// the parents of the form item of the wrapper div!
'path' => ahah_helper_path(array('billing_info')),
'wrapper' => 'billing-info-wrapper',
),
);
$form['billing_info']['update_usage'] = array(
'#type' => 'submit',
'#value' => t('Update usage'),
// Note that we can simply use the generic submit callback provided by the
// ahah_helper module here!
// All it does, is set $form_state['rebuild'] = TRUE.
'#submit' => array('ahah_helper_generic_submit'),
// We set the 'no-js' class, which means this submit button will be hidden
// automatically by Drupal if JS is enabled.
'#attributes' => array('class' => 'no-js'),
);
// If 'company' is selected, then these two form items will be displayed.
if ($usage_default_value == 'company') {
$form['billing_info']['company_name'] = array(
'#type' => 'textfield',
'#title' => t('Company name'),
'#required' => TRUE,
'#size' => 20,
'#maxlength' => 255,
// If the user switched to Private usage and back to Company usage, we
// remembered his company's name!
'#default_value' => $form_state['storage']['billing_info']['company_name'],
);
$form['billing_info']['vat'] = array(
'#type' => 'textfield',
'#title' => t('VAT number'),
'#description' => t('Please enter a Belgian VAT number, the format is: <em>BE0999999999</em>.'),
'#size' => 20,
'#maxlength' => 255,
// If the user switched to Private usage and back to Company usage, we
// remembered his VAT number!
'#default_value' => $form_state['storage']['billing_info']['vat'],
'#ahah' => array(
'event' => 'blur',
'path' => ahah_helper_path(array('billing_info', 'vat')),
'wrapper' => 'edit-billing-info-vat-wrapper',
'effect' => 'none',
'method' => 'replace',
),
);
// Provide instantaneous (#ahah-powered) feedback to the user about the
// VAT number he entered.
if (isset($form_state['storage']['billing_info']['vat']) && strlen($form_state['storage']['billing_info']['vat']) > 0) {
$form['billing_info']['vat']['#field_suffix'] = theme('image', (preg_match('/^BE0\d{9}$/', $form_state['storage']['billing_info']['vat'])) ? 'misc/watchdog-ok.png' : 'misc/watchdog-error.png');
}
}
// And if 'private' is selected, then these two form items will be displayed.
else {
$form['billing_info']['first_name'] = array(
'#type' => 'textfield',
'#title' => t('First name'),
'#required' => TRUE,
'#size' => 20,
'#maxlength' => 255,
// If the user switched to Company usage and back to Private usage, we
// remembered his first name!
'#default_value' => $form_state['storage']['billing_info']['first_name'],
);
$form['billing_info']['last_name'] = array(
'#type' => 'textfield',
'#title' => t('Last name'),
'#required' => TRUE,
'#size' => 20,
'#maxlength' => 255,
// If the user switched to Company usage and back to Private usage, we
// remembered his last name!
'#default_value' => $form_state['storage']['billing_info']['last_name'],
);
}
$form['billing_info']['address'] = array(
'#type' => 'textfield',
'#title' => t('Address'),
'#required' => TRUE,
'#size' => 20,
'#maxlength' => 255,
// Always set #default_value, even if it's not a dynamically added form item!
'#default_value' => $form_state['storage']['billing_info']['address'],
);
$form['billing_info']['country'] = array(
'#type' => 'textfield',
'#title' => t('Country'),
'#size' => 20,
'#maxlength' => 255,
// Always set #default_value, even if it's not a dynamically added form item!
'#default_value' => $form_state['storage']['billing_info']['country'],
);
$form['save'] = array(
'#type' => 'submit',
'#value' => t('Save'),
);
return $form;
}
?>
the above function using the Forms API will out put a form with a dynamic field which will determine how the form is displayed. the "usage" field will control how the rest of the form is displayed based on the value inside that field. This is a basic ahah use case, but you can modify the concepts to anything to do with forms.
<?phpfunction ahah_helper_demo_form($form_state) {
$form = array();
?>
Defines the $form array to be processed by the FormsAPI
<?php// Register the form with ahah_helper so we can use it. Also updates
// $form_state['storage'] to ensure it contains the latest values that have
// been entered, even when the form item has temporarily been removed from
// the form. So if a form item *once* had a value, you *always* can retrieve
// it.
ahah_helper_register($form, $form_state);
?>
calling the ahah_helper_register is the trick to getting ahah_helper to work.
The function ahah_helper_demo_form is called anytime the form is not retrieved from the cache.
The first time the form is rendered the the function is called. Whenever a ahah event is fired the ahah_helper module forces the form to be reloaded and not be retrieved from the cache. Because of this you can modify the form based on the values in the $form_state["values"].
<?php// Determine the default value of the 'usage' select. When nothing is stored
// in $form_state['storage'] yet, it's the form hasn't been submitted yet,
// thus it's the first time the form is being displayed. Then, we set the
// default to 'company'.
if (!isset($form_state['storage']['billing_info']['usage'])) {
$usage_default_value = 'company';
}
else {
$usage_default_value = $form_state['storage']['billing_info']['usage'];
}
?>
This is an example of using the $form_state['storage'] storage variable set by the ahah_helper module. to get the values that were submitted during the ahah event you can retrieve them from the $form_state['storage'] variable.
You also want to set the default values to the submitted values or the new form will contain blank or original default values and the user will need to enter in the values everytime an AHAH is fired, because the form elements are replace with the AHAH values.
In the above example if the $form_state['storage'] is not set that means that function was called not in an AHAH event, so it is probably the first time the form is processed, or else it would be retrieved from the cache.
If the $form_state['storage'] does exist so then the form is probably being re processed during an AHAH call.
<?php$form['billing_info'] = array(
'#type' => 'fieldset',
'#title' => t('Billing information'),
'#prefix' => '<div id="billing-info-wrapper">', // This is our wrapper div.
'#suffix' => '</div>',
'#tree' => TRUE, // Don't forget to set #tree!
);
$form['billing_info']['usage'] = array(
'#type' => 'select',
'#title' => t('Usage'),
'#options' => array(
'private' => t('Private'),
'company' => t('Company'),
),
'#default_value' => $usage_default_value,
'#ahah' => array(
'event' => 'change',
// This is the "magical path". Note that the parameter is an array of
// the parents of the form item of the wrapper div!
'path' => ahah_helper_path(array('billing_info')),
'wrapper' => 'billing-info-wrapper',
),
);
?>
The form element "usage" is defined. And an AHAH event is attached to it.
you will notice the
'#prefix' => '<div id="billing-info-wrapper">', // This is our wrapper div.'#suffix' => '</div>',
specified in the fieldset, this is the path reference later in the
'#ahah' => array('event' => 'change',
// This is the "magical path". Note that the parameter is an array of
// the parents of the form item of the wrapper div!
'path' => ahah_helper_path(array('billing_info')),
'wrapper' => 'billing-info-wrapper',
),
that will be replaced during the AHAH callback.
That pretty much runs though how the ahah_helper module works.
Thanks, I understand how this
Thanks, I understand how this AHAH helper module works, but there are no more demos. Still I can't imagine how to implement in helper module my function. I need exactly this ( http://mohamedshaiful.googlepages.com/add_remove_form.htm - it is demo, but in pure jQuery / HTML ).
Actually,you can copy the
Actually,you can copy the Poll module's codes to use ,see more from here
http://drupal.org/node/331941
http://webmasterclip.com
Finally, I have solved this
Finally, I have solved this problem, it was so simple. I will post my solution later. I made remake of this http://www.stellapower.net/content/ajax-ifying-drupal-node-forms
My AHAH add more / remove form solution
Hi,
here is my solution. It adds and removes dynamically forms in formular.
You can simply edit it to your own needs.
Download it here:
http://rapidshare.com/files/327666082/ahah_add_more_forms.rar