Download & Extend

Multiselect shows up using FAPI, but no interaction

Project:Multiselect
Version:7.x-1.8
Component:Code
Category:bug report
Priority:normal
Assigned:Unassigned
Status:active

Issue Summary

Hi,

I'm using a form to a multiselect widget. It shows up alright, but you can't select any data.

My field looks like

  $form['item_category'] = array(
    '#type' => 'multiselect',
    '#title' => t('Main categories'),
    '#description' => t('Please choose the relevant categories for this entire source.'),
    '#options' => _item_options_categories(),
    '#default_value' => isset($source_config['item_category']) ? $source_config['item_category'] : '0',
    '#multiple' => TRUE,
    '#size' => 10,
    '#required' => FALSE,
  );

And my options like:

<select size="10" id="feeds[FeedsAffiliateHTTPFetcher][item_category]" class="form-multiselect feeds[FeedsAffiliateHTTPFetcher][item_category]_unsel multiselect_unsel multiselect-processed multiselect-unsel-processed" multiple="multiple" name="feeds[FeedsAffiliateHTTPFetcher][item_category]_unsel">
<option value="nono">None</option>
<option value="23">Books &amp; entertainment</option>
<option value="24">- Books</option>
<option value="26">- DVD &amp; movies</option>
<option value="25">- eBooks</option>
<option value="27">- Music</option>
<option value="29">- Video games</option>
..etc..
</select>

The + / - buttons show in Firebug:

<li id="feeds[FeedsAffiliateHTTPFetcher][item_category]" class="multiselect_add multiselect-add-processed"><a href="javascript:;">Add</a></li>

Empty javascript? I get no error messages whatsoever in Firebug. Clicking text & buttons just doesn't do anything.

Comments

#1

I'm getting this notice in Firebug:

Warning: Expected ',' or '{' but found '_sel'.
Source File: http://local.site.dev/node/3/edit
Line:
0

FF3.6 & IE8

#2

Status:active» postponed (maintainer needs more info)

I'm not able to duplicate this using the snippet of code above. Maybe post your full module file?

#3

Ok I noticed the issue may be the css class name. Whichs in my case is like
class="items[FeedsHTTPProcessor][config] (...)"

If I hack it and use a class without square brackets [], then it seems ok. I think jQuery has issues with this kind of CSS classes? Then Feeds module is the problem.

PS My module file is very simple. It's just a kind of hook_form_alter() to change a Feeds module HTTPFetcher settings form.

#4

Status:postponed (maintainer needs more info)» active

Hi, in the function _multiselect_build_widget_code() we create the CSS classes from $element['#field_name']. But sometimes, at least with Feeds module forms, this name looks like feeds[HTTPFetcher][categories].

Problem is, jQuery can't handle [ ] in css class names and breaks multiselect.

SOLUTION:

change:

<?php
$element
['#field_name'] = $element['#name']; // CCK calls the #name "#field_name", so let's duplicate that..
?>

to:

<?php
$element
['#field_name'] = $element['#id']; // CCK uses "#field_name", so let's duplicate that..
?>

This works and solves my problem.