By Caesar Tjalbo on

I've made a module that displays every month with content, clicking on each month gives all the content of that month (works OK). Now I want a dropdownlist above that filled with every year with content. picture (via ImageShack) (I added the red border later for clarity).

The code I've made is (): 

  $select_elements = array('#size' => "", '#title' => "years", '#name' => "", '#value' => $selected_values,
		   '#id' => "mydropdown", '#attributes' => "", '#options' => $select_options,  /* i.e. an array of [$year] = $year */
		   '#description' => "description", '#multiple' => FALSE, '#required' => FALSE);
 /* --- */ 
  $themed_dropdown_html = theme_select($select_elements);  /* theme_select is described in form.inc */
  $output .= $themed_dropdown_html;  /* $output is added to the rest of the HTML to build the block */

It generates the HTML all right but I get warnings on the page:

* warning: implode() [function.implode]: Bad arguments. in C:\Program Files\xampp\htdocs\drupal-4.7.2\includes\form.inc on line 292.
* warning: implode() [function.implode]: Bad arguments. in C:\Program Files\xampp\htdocs\drupal-4.7.2\includes\form.inc on line 292.

Apart from those warnings it somehow feels like this is not 'the proper way' to do it.

  • Am I using the right approach? How should it be done?
  • Do I have to write my own javascript to handle this or is there a more generic, "Drupal" way?
  • Does anyone have a simple piece of sample code to illustrate how to do this?

Comments

Caesar Tjalbo’s picture

Caesar Tjalbo commented

The picture I meant to include.

Caesar Tjalbo’s picture

Caesar Tjalbo commented

It should go into the module creation forum perhaps, even better would be the "explaining basics to n00bs forum" ;-)
My apologies anyway.

pwolanin’s picture

pwolanin commented

I don't think you want to call themed_select. Rather, create the form with drupal_get_form():

http://api.drupal.org/api/4.7/function/drupal_get_form

http://api.drupal.org/api/4.7/file/developer/topics/forms_api.html

See, for example, this use of a form in a block snippet:

http://drupal.org/node/73973

note that the validate, submit, etc. are already defined in contact.module.

---
Work: BioRAFT

Caesar Tjalbo’s picture

Caesar Tjalbo commented

... for your fast answer. It has been partially useful already, although I still need a lot to figure out. Tomorrow, that is.

Caesar Tjalbo’s picture

Caesar Tjalbo commented

Dropdown fills correct, shows correct, no more warnings.

How or where do I receive a returnvalue when the user changes something in the select box, *that is without making the user click on a submit button*?
How do I control an onclick or onchange event? Writing my own javascript or is there a way to handle it via (for example) 

$form['mydropdown'] = array('#type' => "select",
'#attributes' => array('onclick' => 'mydropdown_onclick_function( /* here comes the return value, name unknown to me*/ )'),
.
.
.
mydropdown_onclick_function($args)
{
  $selected_value = $args[0]; /* or whatever it returns */
}

This works somewhat, except I don't have the returnvalue and the mydropdown_onclick_function() is accessed regardless of a click event.

I'm completely lost, please help me out.

Renze’s picture

Renze commented

I am having the same problem with a small module i am building.

I have 2 select box's the first box is filled from db with country's. When some one selects a country, i want to fill the second box from the db with city's.

How do i use onChange, and what values return

dwees’s picture

dwees commented

What I would do here is add is use drupal_add_js and create a javascript function that fires when the selection function is changed. If you place drupal_add_js inside the correct function, it should only show up when that page is viewed.

If you want to make sure there are no clashes with any other drupal javascript, you could prefix all of your functions with your initials.

Here's an example of a sample js that creates a 2nd select list dynamically. It would need some tweeking to solve your problem properly though.

var USA = new Array('New York','Los Angelos','Detroit','Chicago');
var Canada = new Array('Vancouver','Toronto','Winnipeg','Calgary');
var UK = new Array('London','Manchester','Kent','Oxford','Cambridge','Liverpool','Rugby');
var Brazil = new Array('Sao Paulo','Rio de Janeiro');

function init () {
	var country = document.getElementById('country');
	country.onchange = cities;
	return;
}

function cities () {
	var country = document.getElementById('country');
	var city = document.getElementById('city');
	var form = document.getElementById('form');
	if (!city) {
		city = document.createElement('select');
		city.id = 'city';
		city.style.width = '100px';		
		form.appendChild(city);		
	} else {
		city.style.width = '100px';
	}
	switch(country.value) {
		case 'Canada':
			populate(city, Canada);
			break;
		case 'USA':
			populate(city, USA);
			break;		
		case 'Brazil':
			populate(city, Brazil);
			break;		
		case 'UK':
			populate(city, UK);
			break;
		case '':
			form.removeChild(city);
			break;	
	}
}

function populate (city, count) {
	for (i=0;i<count.length;i++) {
		city.options[i] = new Option (count[i],count[i],false);
	}
	return;
}

The HTML form for this is:

<form action="#" id="form">
	<select id="country" style="width:100px">
		<option selected="selected"> </option>
		<option>USA</option>
		<option>Canada</option>
		<option>UK</option>
		<option>Brazil</option>
	</select>
</form>

Then you have to initialize the event, so you need to add some js in the footer (again using drupal_add_js).

	init();

Each of these functions would need to be prefixed with something like your initials to make sure they aren't already defined. Also, there is probably already this function in the Drupal core javascript already.

Dave