noru
noru

Reputation: 547

dojo.connect no longer working with forms?

I was using something like this before Dojo 1.8, but now I get a "node not found" error :

<form dojoType="dijit.form.Form">
  Search :  
  <input type="text" dojoType="dijit.form.TextBox" name="searcht" id="searcht">
  <script type="dojo/connect" event="onSubmit" args="evt">
    my_function();
    dojo.stopEvent(evt);
  </script>
</form>

I noticed that if I remove the search text box the code is working. How can I rewrite the above to work with 1.8, and also please be so kind to point me in the right direction to read about this and understand why this is happening. I should also note that I'm using the same type of code for contentpanes, and the code works fine there.

Thanks, Noru

Upvotes: 1

Views: 567

Answers (1)

Birei
Birei

Reputation: 36292

In dojo 1.8 dojo.connect is dojo/on. First you have to load the modules you are going to use and parse the file to transform dijit elements.

<script>
require([
    "dojo/parser",
    "dijit/form/Form",
    "dijit/form/TextBox",
    "dijit/form/Button"
], function(parser) {
    parser.parse();
});
</script>

Second, declare the dijit properties and funcionality inside html tags:

<div data-dojo-type="dijit/form/Form" id="search_form">
    <script type="dojo/on" data-dojo-event="submit" data-dojo-args="evt">
        evt.stopPropagation();
        alert( "my_function()" );            
    </script>     
    <label for="my_textbox">Search:</label>
    <input type="text" data-dojo-type="dijit/form/TextBox" id="my_textbox"/>
    <button data-dojo-type="dijit/form/Button" id="my_button" type="submit">   
        Submit     
    </button>
</div>

I used a declaratively example inserting dijit options inside the html code. There is other way using only javascript. Take a look in the official documentation: http://dojotoolkit.org/reference-guide/1.8/dijit/index.html

Upvotes: 1

Related Questions