I'm trying to implement a user-friendly way to copy some text from a text input field to the clipboard on iOS/Safari. I understand there is no way to programmatically do it on this platform, but I was hoping I could guide the user experience as much as possible.
On iOS/Safari, when a user manually highlights some text, a contextual Copy menu pops up. I was hoping the same menu would pop up when the text is selected programmatically, but it doesn't. Is it even possible to do that?
If not, any advice on how to best implement a user-friendly experience to copy some text to the clipboard on iOS/Safari?
For reference, I'm selecting the text using the method described in this question:
Programmatically selecting text in an input field on iOS devices (mobile Safari)
It's not possible unfortunately. I'd include some informative text below the input, hopefully that will work out okay in terms of user-friendliness.
Another option would be to go native, e.g. by wrapping using PhoneGap, but I guess you are already well aware of that option. If so, something like this would work in native code:
[UIPasteboard generalPasteboard].string = #"your string";
From javascript it is possible with the help of iOS (objective C).
var getVal = $("#textid").val();
localStorage.setItem("getVal",getVal);
and then you can use your native code for getting this value from local storage.
I haven't knowledge of objective C but you can use that's method after js code.
Related
I'm writing a chrome extension which helps the user type things on twitter. When writing a tweet on twitter, twitter opens an editable div container. When the user types into it, twitter (which is using some web-framework presumably) generates sub-divs and spans with the text the user types and places them within the content-editable div.
The thing is when one manually changes the span value (for instance, through inspect elements), and then types something again, the value in the span will just revert back to what it previously was (before the inspect elements edit). This is probably because the actually typed string is stored somewhere in javascript, and everything gets overwritten again when the user types into the div.
I've been trying to find a way around this using JQuery but with no success. I don't really know how to start. If it were just a regular input tag, you could call something like $("input").val("new value"), easy-peasy... but I don't know how one could go about doing that for an editable div that gets updated by javascript running somewhere on the page.
For a while, I just thought it would be impossible...
BUT NOW I do know it is possible. If you download the Grammarly extension and use the Grammarly popup-editor (which opens a new window to edit text), then submit that, the twitter editable-content div updates appropriately and everything works like magic.
Sorry if this isn't a standard programming question, but I couldn't find anything on the web that comes close to what I'm trying to do. Maybe I'm just not experienced enough and am missing something really obvious. I tried looking at the twitter and Grammarly source code but it's all minified garbled javascript that I can't read...
Thanks for any help and insight!
EDIT: the twitter url in question is: https://twitter.com/compose/tweet The div in question is the one with contenteditable="true" attribute (you can search it in the inspector)
I am very new (couple of days) to HTML/JAVASCRIPT etc and I have started learning UI design with electron. I know how to create buttons and can handle what they do when pressed.
What I could not find is a way to input something in electron js.
For example I want an input field where I will type a number and a button next to it, that when clicked should save this number for other uses. In normal Javascript on a browser I know how to do this, in fact a simple "prompt" can also serve my purpose, but unfortunately even prompt doesn't work on electron ! What is the simplest way to achieve what I am trying to achieve here ?
has anyone ever seem an autocomplete solution in JS that works like Chrome's Console? (I think this is in version 17+)
I am trying to build something using jQuery, but I can't imagine how the autocomplete placeholder that stays below the active text follows the cursor.
All the autocomplete thing, the search, sort, etc... I've already done, I just need a way that the placeholder follows the cursor. Thanks.
Well, why not to use a text box and to call function on any key press/key down. Then the function will read the text that is currently enter and check your data structure for possible end of the word.
You can sort the possible answer and to write the first one for example with other color. If the user press space or enter to color the whore world with black, and if it is press tab to switch with other possible answer...
Do you mean this?I can write some code to show you want I mean if this is what you need?
I want to know if it is possible to select the text anywhere on a webpage and then copy it using jQuery or Javascript.In another language how to invoke CTRL+X,CTRL+C and CTRL+V on a selected text using jQuery or Javascript?.Can this be done?However the CUT command will be invoked on the text which is present in a textarea or textbox not on the hypertext of the webpage. Please let me know.
You could probably invoke the buttons, and copying text on a webpage is most certainly possible with access to the DOM, however it seems like what you are trying to do is access the clipboard, and the way to do that consistently is usually with flash.
The ZeroClipboard plugin is the one most commonly used, it's easy to integrate and gives you full access ro the clipboard.
For an example have a look at CSS3Please, I believe they are using the ZeroClipboard plugin.
Can this be done?
...
I don't want to use Flash
No, not if you need it to work in all major browsers.
I am using CKEditor as a rich text WYSIWYG Javascript editor.
I would like to add an on-screen keyboard so that they can easily enter text from non-English alphabets.
I was planning on finding a JavaScript on-screen keyboard and adding a custom button with a CKEditor plug-in to trigger it.
I've found a couple of JavaScript on-screen keyboards. I like the one that Google provides best. The problem is that it needs to be bound to an HTML <textarea>. As far as I can tell CKEDitor uses an iFrame and has no <textarea>. Does anyone have any ideas for how to work around this problem? Is there a way I can bind the keyboard to the CKEditor "<textarea>"? Or is there an on-screen keyboard that doesn't need to be bound to anything?
Thanks!
You can try this one
http://debugger.ru/demo/projects/virtualkeyboard/richedit/ckeditor/plugins/Jsvk/examples/sample.html
There you'll see development release, but shortly it will be replaced with production one.
Project page: http://sf.net/prokects/jsvk/