How can I add an onchange handler to a dropdown list in Drupal? The dropdown list is added using hook_form(). I have to perform a function depending on the onchange function.
Is there a way to do this?
You can add a form like this:
hook_form()
{
$form1["dropdown"] = array(
'#type' => 'select',
'#title' => t('Preview the page with themes available'),
'#options' => $ptions,
'#default_value' => 'defalut_value',
'#attributes' => array('onchange' => "form.submit('dropdown')"),
);
//Submit button:
$form1['submit'] = array(
'#type' => 'submit',
'#value' => t('Submit '),
'#attributes' => array('style' => 'display: none;'),
);
Now you can add submit functionality using hook_submit().
Here is the simple example using '#ajax' property
$form['select'] = array(
'#type' => 'select',
'#title' => 'Option #1',
'#options' => $option,
'#ajax' => array(
// Call function that rebuilt other field
'callback' => 'ajax_load_field',
'method' => 'replace',
// div to be get replace by function output
'wrapper' => 'chart',
'effect' => 'fade'
),
);
If you generate another form field by using this drop down.
Then use AHAH for that.
$form['my_form_submit'] = array(
'#type' => 'submit',
'#value' => t('Submit'),
'#weight' => 1,
'#submit' => array('my_form_submit'),//none JS version
'#ahah' => array(
'event' => 'click',
'path' => 'mymodule/js', //Your ajax function path
'wrapper' => 'myform-wrapper',
'method' => 'replace',
'effect' => 'fade',
'progress' => array(
'type' => 'bar',
'message' => t('Loading...')
)
),
While I am sure that Nicholas is way past this issue by now, this may help some who are searching for a solution.
I'm using D7 and getting the single quotes around dropdown encoded to ' I suppose by >check_plain. >How do I avoid that? – Nicholas Tolley Cottrell Jun 2 at 16:03
I just found the "Drupal" way of doing this.
Step 1, set a variable to contain dropdown by using drupal_add_js:
drupal_add_js(array('mymodule' => array('varname' => 'dropdown')), 'setting');
Step 2, add the attributes line as
'#attributes' => array('onchange' => "form.submit(Drupal.settings.mymodule.varname)"),
Related
I have a form with a multiple select field where a user can select several values in it
$form['export_type_section']['export_type'] = array(
'#title' => t('Export types'),
'#type' => 'select',
'#multiple' => TRUE,
'#size' => 10,
'#options' => $options,
'#ajax' => array(
'event' => 'change',
'callback' => 'test_export_form_export_type_ajax_callback',
),
);
I have another field in the form
$form['document_type'] = array(
'#type' => 'select',
'#options' => array(0 => t('All Types'), 1 => t('Test1'), 2 => t('Test2'), 3 => t('Test3')),
'#title' => 'Document Types',
'#default' => 0,
'#ajax' => array(
'event' => 'change',
'callback' => 'test_export_form_document_type_ajax_callback',
),
);
I am trying to figure out how to reset the export_type field when the document_type is changed. I would like to clear the selected values so that the user can reselect what is needed whenever the document_type changes. I tried several formats in the test_export_form_document_type_ajax_callback but none worked.
Anybody knows how to do it?
Does form controls in Forms API have id's? Below is my sample code:
function myid_user_page_form(){
$form = array();
$form['id'] = array(
'#type' => 'fieldset',
'#title' => t('ID Information'),
'#collapsible' => TRUE,
'#collapsed' => FALSE,
);
$form['id']['myphoto_button'] = array(
'#type' => 'button',
'#value' => '...',
'#attributes' => array(
'onclick' => "myphoto_options();",),
);
return $form;
}
Sorry for this very simple beginner's question but how to identify my button's id in the sample above(e.g) $form['id']['myphoto_button']?
The #attributes property is used to set html attributes for the element. (Like, id, class, style, onclick, etc.)
I can see that you are using it to bind onclick handler. So, it order to give your button an id:
$form['id']['myphoto_button'] = array(
'#type' => 'button',
'#value' => '...',
'#attributes' => array(
'onclick' => "myphoto_options();",
'id' => 'YOUR-BUTTON-ID',
),
);
I am creating a custom module. I have a form that I would like to add some HTML to, but I don't know what the best way to do this is. In this example, I have a page with a textbox, dropdown list, and text area. I want to add a a div between the dropdown list and text area. But, I'm not sure how to add raw html to a web form. Here is what I have:
function myModule_add_form($form_state){
try{
$form = array();
$form['myModule_title'] = array(
'#title' => 'Title',
'#type' => 'textfield',
'#size' => '30',
'#weight'=>1,
);
$form['myModule_type_list']=array(
'#type'=>'select',
'#title' => 'Type List',
'#options' => $someArray,
'#multiple' => false,
'#attributes'=>array('size'=>1),
'#weight'=>2,
);
$form['myModule_description'] = array(
'#title' => 'Description',
'#type' => 'textarea',
'#size' => '255',
'#weight'=>3,
);
$form['submit'] = array(
'#type' => 'submit',
'#value' => 'Submit',
'#weight'=>4,
);
return $form;
}catch(Exception $e){
$errrmsg = "Error with creating form: " .$e->getMessage();
throw New Exception($errrmsg);
}
}
Thanks
jason
Here is the reference for this:
https://api.drupal.org/api/drupal/developer!topics!forms_api_reference.html/6
I think the best option is the markup form type (This is the default type) so if you do not set the 'type' it will be markup, so you can simply insert something like this wherever you want:
$form['some_div'] = array(
'#value' => '<div>The div</div>',
);
The other option is to use prefix or suffix as also mentioned in the form API, e.g.:
$form['myModule_type_list']=array(
'#type'=>'select',
'#title' => 'Type List',
'#options' => $someArray,
'#multiple' => false,
'#attributes'=>array('size'=>1),
'#weight'=>2,
'#suffix' => '<div>The div</div>',
);
I added the div as a suffix of your list, or it could be a prefix of the text area.
Another way of doing the first option which you may prefer for readability is like this:
$form['some_div'] = array(
'#type' => 'markup',
'#prefix' => '<div>',
'#value' => 'The div content',
'#suffix' => '</div>',
);
I am refactoring some code is a Drupal module I wrote sometime age. In order for others to use it, I am adding a configuration page.
I have successfully defined a fieldset but I don't know how to 'insert' content in to it.
The following code sets up radios for each node type defined on my site:
$node_types = node_get_types('names');
$test = array(
'#title' => t('tweeting node'),
'#type' => 'radios',
'#options' => $node_types,
'#default_value' => 'Page',
'#weight' => 0,
);
And the following defines my fieldset into which I want to insert the radio buttons generated above:
$form['twitterhelper_nodecollection'] = array(
'#type' => 'fieldset',
'#title' => t('select a node'),
'#weight' => 0,
'#collapsible' => TRUE,
'#collapsed' => FALSE,
'#parents' => $test,
);
to add any form element inside the fieldset you should insert this form element inside the field set array ...
E.g
$form['myfieldset'] = array(
'#type' => 'fieldset' ,
'#collapsible' => TRUE ,
'#title' => t('My FIeldset'),
'#attributes' => array('id' => 'myfieldset-id'),
);
$form['myfieldset']['myradios'] = array(
'#type' => 'radios' ,
'#attributes' => array('id' =>'myradio-attributes') ,
....etc
);
so the fieldset is the parent of the radios not the contrast
hop that help you
UPDATE:
you can append the radios inside the field set by using the jquery as the following
jQuery(document).ready(start) ;
function start(){
jQuery("#myradio-attributes").appendTo("#myfieldset-id");
// i added this id by '#attributes'
}
but its not the drupal way
How would you go about constructing a step by step form that uses AJAX through Drupal to pull the next form step?
For example,
Step 1:
I like Baseball
I don't like Baseball.
When that person clicks on either Like or Don't Like, I want to use AJAX to recognize and pull the next part of the form, remove/hide the first section since its not needed, and present the next section.
Example:
Step 1:
I like Baseball
*click
(fade out)
Step 2:
My favorite team is __________
The player I like most is __________
What is the best way to do this through Drupal Form API? I know how to build the forms and modules, but I have never used AJAX yet. I know a few things exist out there that are supposed to help, but I wanted to know if anyone here has done it and how they approached it.
You may want to give a look at the AHAH helper module.
usually i am create full form with fieldsets, then control them manually by jquery.
i assume there lot of ready to go modules in drupal, some of these:
http://drupal.org/project/conditional_fields / http://drupal.org/project/multistep
also: http://www.google.ru/search?q=drupal+multistep+ajax+form
If you don't want to write any code, and don't need the entered data to be drupal nodes, I suggest using the webform module. It has a pretty simple UI for building forms, and allows you do do multipage forms with conditional fields. You can then export the results as CSV, email them, etc.
I have made to solutions for this problem in drupal 7. First one I solve it with Ajax as was requested(if someone want I can convert this to drupal6), however it should be better to solve this using attribute #states. So also made a solution in the bottom using states.
How to solve this using Ajax:
function ajax_in_drupal_form($form, &$form_state)
{
$baseball = array(
'like' => t('I like Baseball'),
'unlike' => t('I don\'t like Baseball')
);
$form['step'] = array(
'#prefix' => '<div id="baseball-wrapper">',
'#suffix' => '</div>',
);
if ($form_state['values']['baseball'] == 'like') {
$form['step']['team'] = array(
'#type' => 'textfield',
'#title' => t('My favorite team is'),
);
$form['step']['player'] = array(
'#type' => 'textfield',
'#title' => t('The player I like most is'),
);
}
else if ($form_state['values']['baseball'] == 'unlike') {
$form['step']['other'] = array(
'#type' => 'textfield',
'#title' => t('What do you like'),
);
}
else {
$form['step']['baseball'] = array(
'#type' => 'radios',
'#options' => $baseball,
'#title' => t('Select your option'),
'#ajax' => array(
'callback' => 'ajax_update_step_callback',
'wrapper' => 'baseball-wrapper',
),
);
}
return $form;
}
function ajax_update_step_callback($form, $form_state) {
return $form['step'];
}
Here is the solution using #states(The preferred way of solving it):
function states_in_drupal_form($form, &$form_state)
{
$baseball = array(
'like' => t('I like Baseball'),
'unlike' => t('I don\'t like Baseball')
);
// step 1
$form['step']['baseball'] = array(
'#type' => 'radios',
'#options' => $baseball,
'#title' => t('Select your option'),
'#states' => array(
'invisible' => array(':input[name="baseball"]' => array('checked' => TRUE),
),
)
);
// step 2 like baseball
$form['step']['team'] = array(
'#type' => 'textfield',
'#title' => t('My favorite team is'),
'#states' => array(
'visible' => array(':input[name="baseball"]' => array('checked' => TRUE)),
'visible' => array(':input[name="baseball"]' => array('value' => 'like')),
)
);
$form['step']['player'] = array(
'#type' => 'textfield',
'#title' => t('The player I like most is'),
'#states' => array(
'visible' => array(':input[name="baseball"]' => array('checked' => TRUE)),
'visible' => array(':input[name="baseball"]' => array('value' => 'like')),
)
);
// step 2 I don't like baseball
$form['step']['other'] = array(
'#type' => 'textfield',
'#title' => t('What do you like'),
'#states' => array(
'visible' => array(':input[name="baseball"]' => array('checked' => TRUE)),
'visible' => array(':input[name="baseball"]' => array('value' => 'unlike')),
)
);
return $form;
}