modelview close tap event passed to underlying widget

[fang]

kendoui mobile version 2013.2.716, test on ipad mini with package with phonegap 2.9.0

(1)  listview 

<ul data-role="listview" data-type="group" id="itemListView" data-click="listViewClick" data-style="inset">
    <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
    <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
    <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
   <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
   <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
   <li><label class="km-listview-label"><textarea id=${idval} onfocus="clearArea(this);" style="width:100%;height: 100px;" maxlength="150">input answer</textarea></label></li>
</ul>

(2) modelview

<div data-role="modalview" id="submitDialog" style="width: 40%; height: 13em;">
    <div data-role="header" class="navbarStyle">
        <div data-role="navbar"><h3>info</h3></div>
    </div>
    <div style="margin:.5em auto; text-align: center;font-size: 1.6em;" id="subcontent">submit ok</div>
    <div style="margin:0 auto; text-align: center;font-size: 1.3em; padding-top:0.5em;">
        <a data-click="closeSubmitDialog" type="button" data-role="button"
           style="width:8em;background-color:#06b375;color:#ffffff;">Enter</a>
    </div>
</div>

(3) javascript

function openSubmitDailog(msg){
    if(MYAPP.dialogOPEN==false){
        MYAPP.dialogOPEN=true;
        var modalView=$("#submitDialog").data("kendoMobileModalView");
        modalView.open();
        if(msg)
            $("#subcontent").html(msg);
    }
}

function closeSubmitDialog(){
    //setTimeout(function(){
        var modalView=$("#submitDialog").data("kendoMobileModalView");
        modalView.close();
        MYAPP.dialogOPEN=false;
        if(MYAPP.status==8){
            init();
        }
        else if(MYAPP.status==4){
            MYAPP.app.navigate("#loginpage");
        }
        //return;
    //},100);

}

process :
openSubmitDailog ----->  modelview popup in midled of  view ------> press "Enter" in modelview  -------->   closeSubmitDialog  ---------->  modelview  close 
----------->   the underlying widget in listview can receive tap event   when close modelview  

for example ,  when close modelview ,  textarea in listview can receive tap event ,so keyboard will be shown up!  I think this a bug in new version 

 

[Petyo]

Hello,

The behavior you observe is by design - the mobile widgets tap/click events are fired on the touchend DOM event, while the textareas are focused on the click event, fired 300ms later (by the way, if I am correct, this happens only in Android). 

If this is a problem for your case, You may work around this by using the click DOM event instead.

Regards,
Petyo
Telerik