I am currently using input text fields that spawn a chooser (listview with various entries) when they are clicked on. Testing this on the appMobi emulator works flawlessly; however, when testing it on an iPhone, the default keyboard appears when the text fields are touched and then quickly disappears to be replaced by the chooser.
Is there a way I can prevent the default keyboard from showing with JQM?
If they require user input, then you can't prevent the browsers' default implementation (at least in a x-browser friendly way). They is certainly no solution with JQM.
I suggest you style your own text box from a div or similar, using html/css. With js you can then wire up the chooser to this element.
Related
The docs doesn't mention this, but does anyone know if it's possible to only show the DatePicker on icon click (or button), and not when the input field receives focus?
Users will primarily enter dates using the keyboard and doesn't want the DatePicker displayed, unless specifically asked for.
You can have a look here for the complete API which has some options that are not documented on the AntDesign site. But there is no option to achieve what you are looking for.
You need the combination of a text input with a button to popup the picker, which is a different paradigm from the one <DatePicker> uses. It could be "hacked" by combining a normal <Input>, <DatePicker> with custom CSS that only shows the button, and some Javascript event handlers.
This will be difficult to explain so I won't paste any code.
I'm implementing a wysiwyg editor on my site called wysihtml5 and there are several issues when selecting the textarea/editor with the iPad. On a desktop browser, all is fine, the text can be selected, edited, pasted etc. But on the iPad multpiple issues occur:
Can't tap anywhere in the text to move the cursor there
If I manually move the cursor, all of a sudden I can't type anything anymore
Tapping outside of the texteditor doesn't bring the keyboard down
Basically I'm just hoping there's someone who has had similiar experiences with iPad cursor not behaving correctly in text input fields and what possible solutions there might be. I'm stuck and have no idea how to debug this.
Did you use touch event? iOS has a bug: you can't input in editable iframe if you are listening(or had listened) any touch event(touchstart, touchmove...), I tested this bug occurs even you listen other elements but iframe itself. yes, it's a serious bug, you can check out:
wysihtml5 issues98
Background/Context:
I am developing touch screen based kiosk application with JavaFX. The app integrates browser – WebView. The problem is that all user inputs have to be made through on screen keyboard (SW keyboard)
It would be nice to have an option to register an event-handler on WebView/WebEngine for any HTML text input element got/lost focus, so that I could show/hide on-screen-keyboard.
Even though I searched the Internet, I did not find this kind of feature.
My questions:
Does JavaFX / WebView provides any support for these cases?
If you were to tackle this problem, what would be your approach to that?
My solution so far:
I have a small button (at one corner of the screen) that allows user to show/hide on-screen-keyboard. Since they have to do that manually, it is quite annoying. Especially on sites where browsing (consuming information) and text inputs changes frequently.
It would be nice to have an option to register an event-handler on WebView/WebEngine for any HTML text input element got/lost focus, so that I could show/hide on-screen-keyboard.
A potential strategy for doing this:
Start with a jdk8 preview.
Run the application with -Dcom.sun.javafx.isEmbedded=true to enable the virtual keyboard.
Use a webengine.executeScript technique to embed jQuery into the target page.
Bind a jQuery focus handler to the relevant html elements.
In the jQuery focus handler make an Upcall from JavaScript to Java.
Upon receiving the upcall make use of JavaFX's Virtual Keyboard.
As the user enters values into the keyboard, make executeScript calls to set the value of the corresponding html field.
Some parts will likely be a bit (or totally) flaky, but perhaps other parts may prove useful to you.
In the future, if WebView is supported on touchscreen platforms on embedded devices, I'm guessing that out of the box it will work well with a virtual keyboard.
SO I have a select box that I fill dynamically. I discovered that once the SELECT gets longer than the page, it automatically becomes a dialog listview.... which is TERRIBLE!
When this happens, the page refreshes when the dialog is closed and my whole page starts over....
Has anyone experienced that and do you know how to shut it off?
Thanks!
Todd
You could use the native look and feel?
http://jquerymobile.com/demos/1.0.1/docs/forms/forms-all-native.html
Native form elements & buttons Although the framework automatically enhances form elements and buttons into touch input
optimized controls to streamline development, it's easy to tell jQuery
Mobile to leave these elements alone so the standard, native control
can be used instead.
Adding the data-role="none" attribute to any form or button element
tells the framework to not apply any enhanced styles or scripting. The
examples below all have this attribute in place to demonstrate the
effect. You may need to write custom styles to lay out your form
controls because we try to leave all the default styling intact.
I have a date field on a PHP website and I'm using jQuery Mobile for mobile site.
While browsing the site on a mobile browser, (eg firefox mobile on android), on clicking on the date text input, the calendar dialog comes up, but the soft keyboard also comes up on my android (Soft keypad comes up whenever one focuses on a input field)
Is there a way, I can force hide the soft keyboard ? Is there a generic javascript based trick to force hide the soft keypad (that works on all mobile devices like iphone, android etc ?
I'm using the jQuery Mobile datepicker from here
TIA
A more simple solution is to add readonly="true" to the input boxes that you have the datepicker attached to. Even though you can't manually type in a date, on mobile you won't have to deal with the keyboard popping up and getting in the way
Just found an answer to my question. (Guess I didn't search with the right keywords earlier :-|)
Adding a jQuery blur event on focus solves the issue.
Thanks to this post by Danny C
My workaround (though I am using a different plugin: the datebox from jtsage.com) is currently the following:
set a disabled attribute on the input
bind a click handler to the input or its parent
the click handler triggers .datebox('open') on the selected element
This way there is no focus element so no triggering of Android soft keyboard.
add the readonly attribute to your date box. (or readonly="readonly") input type="text" data-role="date" readonly
For JQM add the folloiwing files jqm.datepicker.css , jqm.datepicker.theme.css , jqueryUI.js , jqm.datepicker.js