Loading ...
Sorry, an error occurred while loading the content.

Focus not set on dialog when shown via script

Expand Messages
  • mhaertl73
    Hi, i want to show a dialog on context menu click. Therefore i use a function to set some dialog properties and show it. The focus never gets set - even if i
    Message 1 of 4 , Nov 23, 2007
    • 0 Attachment
      Hi,

      i want to show a dialog on context menu click. Therefore i use a
      function to set some dialog properties and show it. The focus never
      gets set - even if i try to call focus() on the input element manually.

      If i trigger dialog.show() with a button click, everything works.

      Any ideas?
      Thanks
      Mike

      <script type="text/javascript">
      YAHOO.util.Event.onDOMReady( function() {
      var showDialog=function(o) {
      // focus will not be set:
      markupDialog.show();
      }
      contextMenu = new YAHOO.widget.ContextMenu("myContext", { trigger:
      "menuTest"});
      contextMenu.addItem( {text: "Show dialog", onclick: { fn: showDialog
      } });
      contextMenu.render(document.body);

      var markupDialog=new YAHOO.widget.Dialog("markupDialog", { width :
      "300px", visible : false,
      buttons : [ { text:"OK" } ]
      });
      markupDialog.render();

      // focus will be set:
      YAHOO.util.Event.addListener("mybutton", "click", markupDialog.show,
      markupDialog, true);
      });
      </script>


      <div id="menuTest" style="width:200px; height:100px; border: 2px solid
      #ccc">Right click here</div>

      <div id="markupDialog">
      <div class="hd">Testdialog</div>
      <div class="bd"><form action="#"><input type="text"></form></div>
      </div>

      <button id="mybutton">Show Dialog</button>
    • mhaertl73
      No one? I forgot to mention: I m using 2.3.1 and this happens only in FF. Things get even worse when creating the dialog completely from Script. Then the
      Message 2 of 4 , Nov 27, 2007
      • 0 Attachment
        No one?

        I forgot to mention: I'm using 2.3.1 and this happens only in FF.
        Things get even worse when creating the dialog completely from Script.
        Then the dialog doesn't set the focus at all no matter from where you
        call its show method.

        So is it just me or does no one use Dialogs like this?
      • Satyen Desai
        Hi, I m not able to reproduce the problem you mention related to creating the Dialog from script, but the problem with the context menu based invocation seems
        Message 3 of 4 , Nov 27, 2007
        • 0 Attachment
          Hi,
          I'm not able to reproduce the problem you mention related to creating
          the Dialog from script, but the problem with the context menu based
          invocation seems to be that the context menu ends up being the last
          thing focused on before it is hidden.

          That is, showDialog is called first, followed by a call to
          MenuItem.focus(), based on the way ContextMenu handles it's clickEvent.

          A possible way around this is provided below, where we wait for the menu
          to be hidden, before showing the Dialog:

          http://yuiblog.com/sandbox/yui/v231/examples/container/contextmenufocus.
          html
          (this example also creates the Dialog from script, to test that issue
          also)

          I don't have too much experience with the Menu widget, but there maybe
          cleaner ways around this issue, based on the way ContextMenu handles
          it's clickEvent.

          Possibly by listening for the clickEvent at the ContextMenu instead of
          the ContextMenuItem, so that it is invoked after the default _onClick
          listener which ContextMenu registers (which sets focus).

          Hope that helps,
          Satyen

          p.s. Another obvious/simple, but fragile way around the issue is to use
          an X ms timeout to call showDialog.
        • mhaertl73
          Thank you very much for your help. It didn t solve my problem completely but at least it helps me to create a workaround. The real reason for my problem is
          Message 4 of 4 , Dec 3, 2007
          • 0 Attachment
            Thank you very much for your help. It didn't solve my problem
            completely but at least it helps me to create a workaround.

            The real reason for my problem is still somewhere in Dialog. I tried
            this (just snippets shown, other code like before):

            scriptDialog=new YAHOO.widget.Dialog("scriptDialog", {
            width : "300px",
            visible : false,
            buttons : [
            { text:"OK", handler: function() { this.submit() },
            isDefault:true },
            { text:"Cancel", handler: function() { this.cancel() } }
            ]
            });

            // Dialog will only be shown when uncommenting this line:
            //scriptDialog.setBody('');
            scriptDialog.form.appendChild(document.createElement("input"));
            scriptDialog.form.elements[0].type="text";
            scriptDialog.form.method="POST";
            scriptDialog.render(document.body);

            Look at the commented line. It only works, if you uncomment this line
            and set Body to empty string. But then again: The focus will not be set.

            If you use

            scriptDialog.setBody('<form action="#"><input type="text"></form>');

            instead of the above, focus will be set again.
          Your message has been successfully submitted and would be delivered to recipients shortly.