1. #1
    Sencha User
    Join Date
    Feb 2014
    Posts
    4
    Vote Rating
    0
    Answers
    1
    evanill80 is on a distinguished road

      0  

    Default Unanswered: Soft keyboard needs to remain displayed after button press event

    Unanswered: Soft keyboard needs to remain displayed after button press event


    After I press the "send" button the soft keyboard is minimized until I select the textarea again. I would like the keyboard to remain displayed after I press send so I can continue to enter new data in the textarea.

    I am using sencha + phonegap but this behavior is present regardless of phonegap so I believe its of no consequence for this bug.

    Screenshots of behavior:
    kingfisher_kybrdmnmizbug1.jpg

    kingfisher_kybrdmnmizbug2.jpg
    Android version: 4.2.2
    Touch version: 2.3.0
    sencha cmd version: v4.0.0.203
    phonegap version: 3.3.0-0.18.0
    Handset tested: samsung galaxy nexus

  2. #2
    Sencha User
    Join Date
    Feb 2014
    Posts
    4
    Vote Rating
    0
    Answers
    1
    evanill80 is on a distinguished road

      0  

    Default


    Is there any additional info/code that can help diagnose this problem? Please let me know.

  3. #3
    Sencha User
    Join Date
    May 2012
    Posts
    4
    Vote Rating
    0
    Lowkay is on a distinguished road

      0  

    Default


    Howdy,

    The issue here is that the touch start event on the button causes Sencha to force the input blur - see Ext.viewport.Default.doBlurInput when autoBlurInput is enabled.

    You could disable auto blur input - but bear in mind that disabling it everywhere will cause edge-cases where the keyboard doesn't hide on certain browser versions (hence it's on by default).

    What we have done is override doBlurInput on the viewport so that we can prevent blurring when we know that we will move focus back to an input field programatically. There is no nice way of doing this because doBlurInput happens on touchstart before your code will know about it.

    Our solution was to add a semantic autofocus css class - although you could do it with a data attribute on your button.

    Then override doBlurInput with something like:

    Code:
    var target = e.target,
                focusedElement = this.focusedElement;
    var targetElement = Ext.fly(target);
    
    
    if (focusedElement && focusedElement.nodeName.toUpperCase() != 'BODY' && !this.isInputRegex.test(target.tagName) && !targetElement.hasCls('autofocus') && !targetElement.up('.autofocus')) {
            delete this.focusedElement;
            focusedElement.blur();
    }

Thread Participants: 1

Tags for this Thread