-3

I need to locate the trigger event that pops up the keyboard on a mobile device when a textarea is clicked, so I can fill a textarea popup I have created with the information in that textarea. I also need to attach the textarea I have created to the mobile keyboard.

EDIT

I am creating a mobile version of our website. Right now, on large screens, if you click a textarea that has saved info in the box, you can edit it.

On the mobile version, they want a popup textbox to appear when you click(touch) the text box, with the original info already pre populated in it, and it also attached to the top of keyboard that pops up on mobile. I need to attach the new textbox to the same click event, and fill it with the editable info.

Dale K
  • 25,246
  • 15
  • 42
  • 71
Chadius
  • 3
  • 2
  • 1
    What have you tried so far? Can you attach your code snippets? – Jschriemer Oct 28 '19 at 18:12
  • 1
    'click' event maybe? – Abdelillah Aissani Oct 28 '19 at 18:15
  • 2
    There is a general javascript click event, but you are really over complicating it. You don't need to do anything to get the keyboard to pop on a mobile device other than just click. If that doesn't happen you prob have issues with your code or device itself. – shadow2020 Oct 28 '19 at 18:25
  • In my opinion what you are doing is not worth it. For a start the mobile keyboard is **NOT** part of the web page, it is part of the browser and its implementation is going to change between browsers/device/os. Just the the browser handle it ... cont – Jon P Oct 28 '19 at 21:49
  • .. cont . If you *must* go down this path, you will need to detect that you are using a mobile browser. Detect when the text area has focus. Create a populated copy of the text box. Display this copy on the page in a position that is going to change by browser/os/device/device orientation. Change the focus to the new text box to receive input. Then when entry is complete reverse the process and populate the original text box. So there is a lot to do for not a lot of gain. One option to take out a couple of steps is to just detach the text box and change it's position. Still a lot of work. – Jon P Oct 28 '19 at 21:55
  • I'm with ya, @JonP. That's exactly what I was trying to tell those responsible for telling me they wanted this done. Ha! I don't think we even need a mobile version of this particular function. But what do I know!?! Thanks anyways. – Chadius Oct 28 '19 at 22:00
  • Push back then :) You can't "attach the textarea I have created to the mobile keyboard" as the mobile keyboard is not part of the DOM. The text area can only be placed on approximations based on browser/os/device info. The best compromise solution is to move page so that the text area is at the top to the view port on focus. – Jon P Oct 28 '19 at 22:05
  • Also see: https://stackoverflow.com/questions/27132796/is-there-any-javascript-event-fired-when-the-on-screen-keyboard-on-mobile-safari – Jon P Oct 28 '19 at 22:12

1 Answers1

1

It is a common mistake to mix up events in JS. What you are looking for is not a click but the focus event. Of course you can focus the element by clicking on it but you can also navigate through elements with the "tab" key. If you are dealing with plain JS you can attach the event with HTML.

Plain HTML/JS:

<textarea name="xxx" id="textid" onfocus="alert('focused');"></textarea>

JQuery:

$('#textid').on('focus', function() {
    alert('focused');
});

To get a good answer you need to provide some code example of what you already have, what you have tried and what is not working.

Dimitri L.
  • 4,499
  • 1
  • 15
  • 19