Dijit events not working in dynamic panes_问答_开发者

Dijit events not working in dynamic panes

开发者 https://www.devze.com 2023-04-07 15:15 出处：网络

Can someone tell me why none of the following will work? EDIT (Just incase the link goes down this question is about how you can\'t seem to fire events in a page that is loaded into a dijit pane. Thi

Can someone tell me why none of the following will work?

EDIT (Just incase the link goes down this question is about how you can't seem to fire events in a page that is loaded into a dijit pane. This is applicable for Firefox 6.0.2, Crome 12.0.742.100 and Opera 11.00.1156 )

<!-- index.html -->


<script>
    dojo.addOnLoad(function() {
        dijit.byId("mainSettings").set("href","index2.html");
    });
</script>

<body class="claro">
    <div id="main" dojoType="dijit.layout.BorderContainer">
        <div dojoType="dojox.layout.ContentPane" splitter="false" id="mainSettings" region="center"></div>
    </div>
</body>


<!-- index2.html -->


<!-- THIS WORKS!!! -->

<select dojoType="dijit.form.Select">
    <option value="bool">On/Off</option>
    <option value="date">Date</option>
    <option value="float">Number</option>
    <option value="text">Text</option>
    <script type="dojo/method" event="onChange">
        alert("change");
    </script>
</select>

<!-- NONE OF THIS WORKS!!! -->

<select dojoType="dijit.form.Select" onChange="change1">
    <option value="bool">On/Off</option>
    <option value="date">Date</option>
    <option value="float">Number</option>
    <option value="text">Text</option>
&l开发者_JS百科t;/select>
<script type="dojo/method" event="change1">
    alert("change1");
</script>



<button dojoType="dijit.form.Button" onClick="change2">
    change2
</button>
<script type="dojo/method" event="change2">
    alert("change2");
</script>


<script>
    dojo.addOnLoad(function() {
        dojo.connect(dijit.byId('button2'), 'onClick', function(){
            alert("change3");
        });
    });
</script>
<button dojoType="dijit.form.Button" id="button2">
    button2
</button>

EDIT Dojango code:

#forms.py

type = CharField(widget=Select(choices=VARIABLE_CHOICES,attrs={'onChange':'letterVariableTypeSelectChange'}))

#template

{{ form.type }}
<script>
    function letterVariableTypeSelectChange(){
        alert("dave");
    }
</script>

Try setting the executeScripts and parseOnLoad properties to true on the dojox.layout.ContentPane

<div id="main" dojoType="dijit.layout.BorderContainer">
        <div dojoType="dojox.layout.ContentPane" executeScripts="true" parseOnLoad="true" splitter="false" id="mainSettings" region="center"></div>
</div>

There also appears to be a fundamental disparity to how you are using dojo/method.

The <script type="dojo/method"> tags should go inside the elements that they are overriding

Notice how your snippet that works is defined:

<select dojoType="dijit.form.Select">
    <option value="bool">On/Off</option>
    <option value="date">Date</option>
    <option value="float">Number</option>
    <option value="text">Text</option>
    <!--Script tag inside widget node, event is the name of the event to override -->
    <script type="dojo/method" event="onChange">
        alert("change");
    </script>
</select>

versus the ones that don't work:

<!--onChange here is specified directly on the widget (which is incorrect), should be in the 
    <script type="dojo/method" event="OnChange"> 
-->
<select dojoType="dijit.form.Select" onChange="change1">
    <option value="bool">On/Off</option>
    <option value="date">Date</option>
    <option value="float">Number</option>
    <option value="text">Text</option>
</select>
<!--script tag outside the select.  event refers to a nonexistent event for the widget.-->
<script type="dojo/method" event="change1">
    alert("change1");
</script>

You get can the list of available events that you can use dojo/method to override at the reference documentation for a given widget.

http://dojotoolkit.org/api/dijit/form/FilteringSelect