Bootbox input lost focus on alt key

I am currently trying to create a user settings page. On this page, the user can change their email address by clicking a button that opens a pop-up window. In this pop-up window, he will have to enter his new email address. The problem is that when I press a key Alt, I lose the input focus. So ... I can't type any email address because I can't add "@" (yes, I'm French and I have an AZERTY keyboard: /).

My question is, what can I do to avoid losing focus?

I am developing my web app in Meteor and Jade. Here's my popup template:

template(name="change_mail")
  table.table.table-responsive.large-table
    tbody
      tr
        td {{_ "current_mail" }} :
        td.table-text#old-mail
      tr
        td {{_ "new_mail" }} :
        td
          input.black#new-mail(type="text" name="mail")

      

And my controller:

Template.change_mail.rendered = function ()
{
  document.getElementById('new-mail').focus(); // Don't work 
}

"click #change_mail": function (event, template)
{
    event.preventDefault();
    var user = Meteor.user();
    bootbox.dialog(
    {
        title : t('change_mail'),
        message : "<div id='dialogNode'></div>",
        className : "info-popup",
        buttons : 
        {
            cancel :
            {
                label : t('back'),
                className : "btn-default btn-lg"
            },
            success : 
            {
                label : t('update'),
                className : "btn-info btn-lg",
                callback : function ()
                {
                    var mail = $("#new-mail").val();
                    if (mail === "")
                    {
                        return;
                    }
                    else
                    {
                        Meteor.call('updateMail', user._id, mail);
                        displayPopup(t("success"), t("success_change_mail"), t("ok"), "btn-success btn-lg", "success-popup");
                    }
                }
            }
        }
    });
    Blaze.render(Template.change_mail, $("#dialogNode")[0]);
    $("#old-mail").text(user.emails[0].address);
},

      

EDIT: I tried to change the library using Magnific Popup. I get focus when the popup is open, but I immediately lost it. Anyway, I lost focus when I press a key Alt. I do not understand why.

+3


source to share


2 answers


This is because you are using Ubuntu. On ubuntu, the alt key is the system key that is bound to "enter command".

Link: https://github.com/Guake/guake/issues/352

So, if your clients are not using ubuntu + Azerty keyboard, that's fine.



As a dirty fix, you can catch the event when a key is pressed, and if that key is alt, just get focus with

document.getElementById('email').focus();

      

+2


source


Try using the JS DOM focus () function.

May work if focus is only set on the text field in the popup.



eg:

document.getElementById('email').focus();

      

0


source







All Articles