This is a migrated thread and some comments may be shown as answers.

Touch + Input + Focus = Keyboard open and then close

4 Answers 165 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 10 Jan 2013, 03:54 AM
Do I need to use a timeout function on the tap event of the touch widget?  I have a touch image that is bound to the tap event that draws focus on the input. However, the keyboard opens and then automatically closes.

$plugin.closest('span').append('<img src ="srb-images/srb-delete.png" class="bar">').find('img').kendoTouch({ tap: function(e) {

                                                                                                                               console.log(e.touch.target.attr('class') + " was tapped");

                                                                                                                               e.touch.target.prev().focus();

                                                                                                                               }

                                                                                                                               });

                   });


On the other hand, if I hold the touch for a period of time, the keyboard stays open.

~ richard

iOS simulator

4 Answers, 1 is accepted

Sort by
0
Petyo
Telerik team
answered on 11 Jan 2013, 03:08 PM
Hi,

The tap event of the touch widget is based on the touchend DOM event. After a certain delay (~300ms) the browser triggers an emulated click event. Chances are, the click event blurs the input in question. You may try using onclick="return false;" on the tapped element - perhaps it will mitigate the blur. 

Kind regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
John
Top achievements
Rank 1
answered on 11 Jan 2013, 06:50 PM

Hello,
 I tried the onclick="retrun false;" in the image element.  It does not work.  My caretTo method uses 

setSelectionRange(index, index) method to send the caret to index 0, which invokes the focus to the element.  

I tried using just jquery to bind a click event to the image, however it did not work, so I used the Kendoui widget.  Is there anywhere else I can intercept the DOM bubble?


 this.buttonDelete= function() {

                   $plugin.closest('span').append('<img src ="srb-images/srb-delete.png" onclick="return false;" class="bar">').find('img').kendoTouch({ tap: function(e) {

                                                                                                                                

    methods.caretTo.call(e.touch.target.prev(),0);

}

                                                                                                                               });

                   }

thank you,

richard
0
John
Top achievements
Rank 1
answered on 14 Jan 2013, 08:06 PM
Petyo,

Thanx for the reply.  

I have a working version in a static page under input + kendoui + phonegap.  I m only using query, since the touch widget is an over kill for this situation. I used the data-show event to init the inputs. It appears to load ok, but the image does not recognize the bound event.  This view is an external link.  Is there more pre transiton setup to do?  It kinda behaves as if jquery is not loaded.  I can click on the image several times until it fires.

~ cheers
0
Petyo
Telerik team
answered on 15 Jan 2013, 08:58 AM
Hi John,

I am not sure that I completely understand your project setup. Anyway, if preventing the click event does not work for your case, you may consider using the timeout approach initially mentioned. 

In case you still need assistance with this problem, is it possible for you to provide a sample project, so that we can reproduce the issue on our side? 

Thank you in advance,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
General Discussions
Asked by
John
Top achievements
Rank 1
Answers by
Petyo
Telerik team
John
Top achievements
Rank 1
Share this question
or