6

onchangeイベントをdijit.form.Selectウィジェットに正しくアタッチできないようです。しかし、私はWeb開発に慣れていないので、完全にばかげたことをしている可能性があります(ただし、私が知る限りでは(そして、見つけたすべてのドキュメントを読んだことがありますが)、そうではありません)。bodyクラスがdojoテーマと一致することを確認しました。これは、使用するすべてのウィジェット(およびdojo.parser)に対してdojo.require()であり、それでもnadaです。私が使用しているコードは次のとおりです。

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が実際に1つをレンダリングすることを発見しました-行2列のテーブル。テーブルの最初の要素は、選択された(またはデフォルトの)要素を表示するだけであると想定しているスパン(クラスdijitSelectLabel)です。2番目の要素は、特定のDOMイベントに応答してメニューテーマの表示を切り替える下矢印としてレンダリングされたボタンのように見えます。また(そしてこれはかなり気の利いたことだと思いました)、dijitは、これらのイベントの1つがトリガーされるまで、実際にはDOMツリーに選択オプションを配置しません。新しいページを読み込んだ直後(何かをクリックする前)にfirebugのHTMLを調べましたが、2番目のオプションはどこにも見つかりません。次に、矢印ボタンをクリックすると、dijit.Menuウィジェットが表示されます。dijitはdijit.Menuを本体ノードの最後に貼り付けます。別の場所をクリックした後も、メニューウィジェットは本体のlastChildのままであり、現在は非表示になっており、フォームにアタッチされていません。ウィジェットを選択してください。

ユーザーが選択したアイテムに応じて、DOMツリーに異なるdijit.formウィジェットを配置するだけの場合、これは本当に複雑なことでしょうか。

結論:それは資本化の問題であることが判明しました。

dojo.connect(widget_obj, 'onChange', function_obj);
動作しますが、

dojo.connect(widget_obj, 'onchange', function_obj);
そうではありません。

だから私は完全に愚かだったのは正しかった。htmlタグを属性として配置すると、すべて小文字のバージョンが機能するため、Dojoはそれを同じように扱うと思いました。dijit.form.Selectには.onchange属性がありませんが、.onChange属性があるため、これは理にかなっています。(ユーザーが何かを入力できるという印象をユーザーに与えないため、.FilteringSelectよりも.Selectを使用することになりました。)それで、どちらに答えますか(両方の理由で)あなたの投稿にonChangeがありましたが、私は経験が浅すぎて、ケースが重要であることに気づかなかったと思います)?

4

3 に答える 3

4

Web検索でこのページを見つけた他の人にとっては、私が行ったのと同じ間違いを犯した可能性があります。それぞれが同じ「値」を持つようにマークアップをコピーして貼り付けます。

例えば

<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を起動しないためです。

于 2010-05-24T03:37:33.833 に答える
2

dojo.connectを実行するときは、次のことを試してください。

  var inputEvents = [];  //Global var

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

接続をグローバル変数に格納します。

于 2010-04-01T16:48:27.490 に答える
1

コードでは、ハンドラーをdojoウィジェットではなくdomノードの「onchange」イベントに接続します。dojo.queryは、NodeListオブジェクト(クエリに一致するノードのコレクション)を返します。
この場合、GoinOffが示したように、ウィジェットの「onChange」イベントに接続する方が信頼性が高くなります。あなたがこれを正しくやっていることを確認するために彼の答えにほんの少し追加します。
これがあなたの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(){});
}

ただし、ウィジェットのIDがわからず、dojo.queryを使用して複数のウィジェットに接続したい場合は、別の話になります。

于 2010-04-02T07:37:23.403 に答える