appcelerator - Hide keyboard on ios titanium -
on titanium app have form many fields (textfield etc...), when focus on textfield shows ios keyboard , want hide when click somewhere on window :
<alloy> <window id="home" > <view id="form"> <require type="view" id="myviewform" src="form/etape_1" /> </view> </window> </alloy>
inside myviewform :
<alloy> <view> <textfield id="name" hinttext="name"/> <textfield id="telephone" hinttext="téléphone"/> </view> </alloy>
note : see have textfield id "telephone" show numbers.
on controller home file :
/*----------------------------------------- | | event listener click on window -------------------------------------------*/ $.home.addeventlistener("click", hidesoftkeyboard); /*----------------------------------------- | | hide keyboard -------------------------------------------*/ function hidesoftkeyboard(e){ if(ti.platform.osname === 'android'){ ti.ui.android.hidesoftkeyboard(); } else { $.home.textfield.blur(); } }
on android works well, on ios have following error :
[error] : script error { [error] : column = 103; [error] : line = 12; [error] : message = "undefined not object (evaluating '$.home.textfield.blur')"; [error] : stack = hidesoftkeyboard; [error] : }
someone me please ? thank you.
here code you:
index.js
$.home.addeventlistener("click", hidesoftkeyboard); $.home.open(); function hidesoftkeyboard(e){ if(os_android){ ti.ui.android.hidesoftkeyboard(); } else { $.myviewform.name.blur(); $.myviewform.telephone.blur(); } }
- but remember if not set
bubbleparent="false"
on text-fields, click event on window fired click on text-field. - so careful using click event on whole window.
- if purpose of using click event on window hide keyboard on ios using phone layout keyboard, suggest property textfield keyboardtoolbar serve purpose well.
here complete cross-platform code hide telephone keyboards.
index.js
$.home.open();
myviewform.xml
<alloy> <view layout='vertical'> <textfield id="mobile_field" class="phone fields" platform="android" /> <textfield id="mobile_field" class="phone fields" platform="ios"> <keyboardtoolbar> <toolbar> <items> <flexspace /> <button title="done" onclick="hidekeyboard" /> </items> </toolbar> </keyboardtoolbar> </textfield> </view> </alloy>
myviewform.tss
// accept phone numbers, + sign also.. ".phone[platform=ios]" : { keyboardtype : ti.ui.keyboard_type_number_pad, } ".phone[platform=android]" : { inputtype : [ti.ui.input_type_class_number] } ".fields" : { top : 30 width : '80%', height : 50, bordercolor : 'black', borderwidth : 2 }
myviewform.js
function hidekeyboard() { $.mobile_field.blur(); }
Comments
Post a Comment