2010-04-01 1 views
6

Кажется, я не могу правильно привязать событие onchange к divjit.form.Select widget. Тем не менее, я новичок в веб-разработке, поэтому я мог бы делать что-то совершенно идиотское (хотя, насколько я могу судить (и я прочитал все документы, которые мог найти), я не). Я убедился, что класс body соответствует теме dojo, что я dojo.require() для всех виджетов, которые я использую (и dojo.parser), и все же нада. Код, который я использую:Не могу получить onChange to fire for dijit.form.Select

dojo.addOnLoad(function() { 
    var _query = dojo.query('.toggle'); 
    for (var i in _query) { 
     dojo.connect(_query[i], 'onchange', function (ev) { 
      console.log(ev + ' fired onchange'); 
     }); 
    } 
}); 

Любая помощь вообще будет оценена по достоинству.

Дополнение: после того, как я перекопал внутреннюю часть того, как dijit визуализирует виджеты, я обнаружил, что, когда я добавляю пару атрибутов dojoType = 'dijit.form.Select' в мой элемент html (делая это декларативно), на самом деле dijit отображает однострочную таблицу с двумя столбцами. Первый элемент таблицы - это span (с классом dijitSelectLabel), который я предполагаю, просто отображает выбранный (или по умолчанию) элемент. Второй элемент - это кнопка, отображаемая как стрелка вниз, которая переключает отображение меню itmes в ответ на определенные события DOM. Также (и я думал, что это было довольно изящно), dijit фактически не помещает опции выбора в дерево DOM до тех пор, пока не произойдет одно из этих событий. Я посмотрел на HTML в firebug сразу после новой pageload (до того, как я нажал на что-либо), а второй вариант нигде не найден. Затем, как только я нажимаю на кнопку со стрелкой, есть виджет dijit.Menu, dijit палочки dijit.Menu до конца узла тела; после того, как я щелкнул в другом месте, виджет «Меню» по-прежнему является последней версией bodyChild, теперь он просто скрыт и не привязан к форме. Выберите виджет.

Должно ли это быть сложным, если все, что я хочу сделать, это разместить другой виджет dijit.form в дереве DOM в зависимости от того, какой элемент выбирает пользователь?

Заключение: Оказывается, это была проблема капитализации.

dojo.connect(widget_obj, 'onChange', function_obj); 
работает, тогда как

dojo.connect(widget_obj, 'onchange', function_obj); 
нет.

Так что я был прав, что был совершенно глуп. Я предположил, что, поскольку вся версия нижнего регистра работает, когда помещаю в него html-тег как атрибут, Dojo будет относиться к нему одинаково. Это имеет смысл, потому что dijit.form.Select не имеет атрибута .onchange, но имеет атрибут .onChange. (Я закончил тем, что придерживался .Select над .FilteringSelect, потому что я не хочу, чтобы у моих пользователей было какое-то впечатление, что они могут что-то ввести.) Итак, какой из вас, ребята, я даю ответ (потому что вы оба у меня на вашем месте, я думаю, я был слишком неопытен, чтобы понять, что дело имело значение)?

ответ

2

Попробуйте следующее при выполнении dojo.connect:

var inputEvents = []; //Global var 

    inputEvents.push(dojo.connect(dijit.byId(inputFldStr), "onChange", eventFuncObj)); 

Храните соединение в глобальной переменной.

+0

Я пробовал как dijit.byId (nodeId), так и dijit.byNode (узел), и ни один из них не работал. – yarmiganosca

1

В вашем коде вы подключаете обработчик к событию «onchange» для узлов dom, а не для виджетов dojo. dojo.query возвращает вам объект NodeList - набор узлов, соответствующих запросу.
В этом случае более надежно подключаться к событию «onChange» виджета, как показал GoinOff. Просто небольшое дополнение к его ответу, чтобы убедиться, что вы делаете это правильно.
Предположим, что это ваш html (в более поздних версиях Dojo dijit.form.Select был заменен dijit.form.FilteringSelect):

<input dojoType="dijit.form.FilteringSelect" id="stateInput" store="stateStore" searchAttr="name" name="state"/> 

Тогда вы бы подключиться к «OnChange» таким образом (вы можете также сохранять соединение в некотором массиве, чтобы иметь возможность отключить его позже, как это было предложено GoinOff):

dojo.addOnLoad (function() { 
    dojo.connect(dijit.byId("stateInput"), "onChange", function(){}); 
} 

Но это еще одна история, если вы не знаете идентификатор вашего виджета и хотите использовать dojo.query для подключения к нескольким виджетам.

+0

Это тоже не сработало (особенно потому, что параметры, отображаемые вне виджета, до тех пор, пока я не изменил его на