Ariod
Ariod

Reputation: 5851

Dojo - submitting form by pressing Enter

I have the following code:

<div dojoType="dijit.layout.ContentPane" id="filterForm" style="padding: 3px">
    <form dojoType="dijit.form.Form">
        <input dojoType="dijit.form.TextBox" style="width: 120px" />
        <button dojoType="dijit.form.Button" type="submit">
            Filter
        </button>
        <script type="dojo/connect" event="onSubmit" args="evt">
            filterGrid();
            dojo.stopEvent(evt);
        </script>
    </form>
</div>

It works as expected if I click the Filter button, however I would like the same behavior when user presses Enter, while textbox is focused. This doesn't happen, though. In fact, nothing happens when I press Enter. How can I have the onSubmit handler execute upon pressing Enter? Thanks.

Upvotes: 2

Views: 5542

Answers (3)

hshib
hshib

Reputation: 1750

I encountered same issue that this was not working on Internet Explorer only (works with Firefox, Chrome fine) for our old code base using Dojo 1.5.0.

Turned out to be a bug in Dojo with IE's issue with hidden form and it was fixed by this patch.

Upvotes: 0

Archana Nogriya
Archana Nogriya

Reputation: 1

This is solution I have written and worked for me. Submit the enter key on "dijit/form/ValidationTextBox" using Mocha tests

keyEventDispatch : function (element, code, completionFn) {

        var keyboardEvent = document.createEvent("KeyboardEvent");

          Object.defineProperty(keyboardEvent, 'keyCode', {
            get : function() {
              return this.keyCodeVal;
            }
          });
          Object.defineProperty(keyboardEvent, 'which', {
            get : function() {
              return this.keyCodeVal;
            }
          });
          var initMethod = typeof keyboardEvent.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";
          keyboardEvent[initMethod](
             "keypress", // event type : keydown, keyup, keypress
             true, // bubbles
             true, // cancelable
             window, // viewArg: should be window
             false, // ctrlKeyArg
             false, // altKeyArg
             false, // shiftKeyArg
             false, // metaKeyArg
             code, // keyCodeArg : unsigned long the virtual key code, else 0
             0 // charCodeArgs : unsigned long the Unicode character associated with the depressed key, else 0
          );
          keyboardEvent.keyCodeVal = code;
          if (element.dispatchEvent) element.dispatchEvent(keyboardEvent);  
          if (completionFn) completionFn();
    },

and in your test you will be calling keyEventDispatch(textboxes, 13);

Hope that helps

Upvotes: 0

Caleb
Caleb

Reputation: 5438

Dario this should work. Something else in your environment is screwing it up. You might have another bit of script that is intercepting keystrokes. This could be in your scripts on the web page or even in your browser environment such as a grease monkey script or other extention.

You should setup a minimal test case where the web page includes only some bare minimal html including that form and load dojo from the aol or google CDN's and try the enter. If it doesn't work give us a full copy of (or the URL to) your test and we'll try to see what's going wrong, but I suspect that will work. Then you need to work backwards between the minimal test case and your full site environment until you find the conflicting bit of script.

Upvotes: 4

Related Questions