Catch pasted input in textarea

with javascript(Jquery).

Searched online, seems like it's not possible. So far I have something like:

$("#textAreaId").bind('paste', function (e) {
        alert('pasting text!!!!');

        var data = $("#taData").val();

        alert(data);



    });

but the data is empty at this stage...is there a way to capture the pasted input after it's been pasted? Seems like there should be a way.

keyup event in Jquery is not triggered when pasting occurs.

Any ideas?

From stackoverflow gnomixa

• Not all browsers support the same copy / paste capabilities. Here is a chart of which browser support which functions:

  http://www.quirksmode.org/dom/events/cutcopypaste.html

  If the browser supports capturing the copy / paste events, jQuery should work fine. I would suggest testing each of your targeted browsers.

  Another approach would be to use the jQuery 'data' property to detect that the input field has changed. Here is an article with example code:

  http://www.mydogboris.com/2009/10/using-jquery-data-feature-to-detect-form-changes/

  from the article:

  var formChanged = false;
  
  $(document).ready(function() {
       $('#my_form input[type=text].editable, #my_form textarea.editable').each(function (i) {
            $(this).data('initial_value', $(this).val());
       });
  
       $('#my_form input[type=text].editable, #my_form textarea.editable').keyup(function() {
            if ($(this).val() != $(this).data('initial_value')) {
                 handleFormChanged();
            }
       });
  
       $('#my_form .editable').bind('change paste', function() {
            handleFormChanged();
       });
  
       $('.navigation_link').bind("click", function () {
            return confirmNavigation();
       });
  });
  
  function handleFormChanged() {
       $('#save_or_update').attr("disabled", false);
       formChanged = true;
  }
  
  function confirmNavigation() {
       if (formChanged) {
            return confirm('Are you sure? Your changes will be lost!');
       } else {
            return true;
       }
  }
  

  gnomixa : Capturing the event works, it's the TEXT pasted that I am wondering how to get. In IE, clipboardData object can be used, but it's not available in FF. And yes, the above code works for both IE and FF so capturing the paste event in NOT the issue.

  gnomixa : So in other words, comparison (or timer) is the only way to go? There is no such thing as postpaste event?
  From Stephen Moran

• I've answered a similar question before: http://stackoverflow.com/questions/3239124/javascript-catch-paste-event-in-textarea/3239609#3239609

  gnomixa : Thanks Tim, I saw this earlier, but the reason I posted this was because I want (rather have) a less cumbersome way to do this. I mean, it should be easy, right? So far it looks like I am going to have to put a timer on a field and start it when paste event has been captured. Seems kind of a backwards way, but looks like there is no alternative.

  Tim Down : I've looked into it and I'm nearly certain there isn't an easier way.

  gnomixa : see my answer for the easier way for what I need to achieve.
  From Tim Down

• Here is what I have decided to do. Please note that I am merely required to grab the pasted content.

  $(document).ready(function () {         
  
      $("#taData").bind('paste', function (e) {
          setTimeout(function () { DisplayPastedData(); }, 100);
      });    
  
  });
  
  
  
  function DisplayPastedData() {
  
      var data = $("#taData").val();
      alert('input pasted ' + data);
  
  
  }
  

  I have arbitrarily selected 100 milliseconds to wait, which works nicely with my maximum of data pasted.

  Tim Down : Right... so what happens if the user pastes text into a textarea that already contains text?

  gnomixa : that's not something that I am required to cover according to my requirements. The pasting will occur once, pasted input will be parsed out, and used to populate the table, each subsequent pasting will overwrite the previous one. See my original question. There is nothing about covering the pasting when the textarea is not empty.

  Tim Down : Fair enough. In which case, I'd suggest emptying the textarea after you've got the data: `function DisplayPastedData() { var $ta = $("#taData"); data = $ta.val(); alert('input pasted ' + data); $ta.val(""); }`
  From gnomixa