لا يمكنني الحصول على onchange لإطلاق النار من أجل dijit.form.select

Question

يبدو أنني غير قادر على إرفاق حدث OnChange بشكل صحيح بعامل Dijit.form.select. ومع ذلك ، فأنا جديد على تطوير الويب ، لذلك يمكن أن أفعل شيئًا غبيًا تمامًا (على الرغم من أنه أفضل ما يمكنني قوله (وقرأت جميع المستندات التي يمكنني العثور عليها) أنا لست كذلك). لقد تأكدت من أن فئة الجسم تتطابق مع موضوع dojo ، وأنني dojo.require () لجميع الأدوات المصغّرة التي أستخدمها (و dojo.parser) ، وما زالت نادا. الرمز الذي أستخدمه هو:

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 بإعداد أجهزة واجهة المستخدم ، اكتشفت أنه عندما أضيف dojopee = 'dijit.form.select "زوج السمة" إلى عنصر HTML الخاص بي (القيام بذلك بشكل تعريفي) ، فإن DIJIT يجعل فعليًا One- الصف ثنائي الجدول. العنصر الأول للجدول هو امتداد (مع فئة dijitselectlabel) التي أفترض أنها تعرض فقط العنصر المحدد (أو الافتراضي). يبدو أن العنصر الثاني هو زر يتم تقديمه كسهم لأسفل يتبديل عرض القائمة Itmes استجابة لبعض أحداث DOM. أيضًا (واعتقدت أن هذا كان أنيقًا جدًا) ، لا يضع Dijit بالفعل الخيارات المحددة في شجرة DOM حتى يتم تشغيل أحد هذه الأحداث. لقد نظرت إلى HTML في Firebug مباشرة بعد صحة طازجة (قبل النقر على أي شيء) ، والخيار الثاني ليس في أي مكان يمكن العثور عليه. ثم ، بمجرد النقر فوق زر السهم ، يوجد عنصر واجهة مستخدم Dijit.menu ، يلتصق Dijit dijit.menu حتى نهاية عقدة الجسم ؛ بعد النقر فوق مكان آخر ، لا يزال عنصر واجهة المستخدم هو LastChild في الجسم ، والآن يخفي فقط وغير متصل بالشكل. حدد عنصر واجهة المستخدم.

هل يجب أن يكون الأمر معقدًا حقًا إذا كان كل ما أريد فعله هو وضع أداة مختلفة dijit.form في شجرة DOM اعتمادًا على العنصر الذي يختاره المستخدم؟

الخلاصة: تبين أنها كانت قضية رسملة.

dojo.connect(widget_obj, 'onChange', function_obj);

يعمل ، في حين

dojo.connect(widget_obj, 'onchange', function_obj);

لا.

لذلك كنت محقًا في أنني كنت غبيًا تمامًا. لقد افترضت أنه نظرًا لأن الإصدار الصغير يعمل عند وضع علامة HTML فيه كسممة ، فإن Dojo سوف يعاملها كما هي. من المنطقي ، لأن dijit.form.select ليس له سمة .onchange ، ولكن لديها سمة .onchange. (انتهى بي الأمر بالالتزام بـ. حدد "filteringselect هل كان ذلك في مشاركاتك ، أعتقد أنني كنت عديمي الخبرة للغاية لأدرك أن القضية مهمة)؟

Answer 1

جرب ما يلي عند القيام dojo.connect:

  var inputEvents = [];  //Global var

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

تخزين الاتصال في VAR العالمية.

Answer 2

لأي شخص آخر يجد هذه الصفحة من خلال بحث على شبكة الإنترنت ، فقد تكون قد ارتكبت نفس الخطأ الذي ارتكبته .. نسخ ترميزك بحيث يكون لكل منها نفس "القيمة".

على سبيل المثال

<select dojoType='dijit.form.Select' onChange="fn">
<option value='foo'>Foo 1</option>
<option value='foo'>Foo 2</option>
<option value='foo'>Foo 3</option>
</select>

لن يتم استدعاء FN () أبدًا ، لأن رمز معالج التغيير يتحقق من القيمة الجديدة مقابل القيمة المحددة مسبقًا ولا تطلق النار على onchange ما لم يتم تغييرها.

Answer 3

في الكود الخاص بك ، تقوم بتوصيل معالج بحدث "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 للاتصال بعناصر واجهة مستخدم متعددة.