jquery email extractor live from textarea

Question

Okay so i have 2x textarea with different id's. I'm trying to extract the emails pasted into the first textarea and then displayed into the second textarea. I know my jquery work for extracting and sorting emails from text in a page, but i cant seem to get it to work with textarea's.

My code for the textarea's is as followed:

<textarea id="email-extractor" class="email-extractor-textarea"></textarea>
<textarea id="email-extracted" class="email-extractor-textarea"></textarea>

My code for the is as followed:

<script>

function extractEmails (text)
{
    return text.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi);
}

function eliminateDuplicates (arr) {
    var i;
    var len=arr.length;
    var out=[];
    var obj={};

    for (i=0;i<len;i++) {
        obj[arr[i]]=0;
    }
    for (i in obj) {
        out.push(i);
    }
    return out;
}

var emailsFullList = [];

$('#email-extractor').keyup(function( index ) {
    var emails = extractEmails($(this).text());

    if (!emails) {
       $('#email-extracted').text('** No emails in comment');
    } else if (emails.length < 3) {
        emailsFullList = emailsFullList.concat(emails);
    } else {
        $('#email-extracted').text('** Ignoring comment, too many email addresses ('+emails.length+').');
    }
});

emailsFullList = eliminateDuplicates(emailsFullList);

$('#email-extracted').text(emailsFullList.join());

</script>

Answer 1

Your code seems to be working the only thing is that you were not adding the text to the second text area correctly:

DEMO : http://jsfiddle.net/nkLvwtLa/

$('#email-extractor').keyup(function (index) {
    var emails = extractEmails($(this).val());
    console.log(emails);
    if (!emails) {
        $('#email-extracted').text('** No emails in comment');
    } else if (emails.length < 3) {
        var text = '';
        for (var i = 0; i < emails.length; i++) {
            text += emails[i] + ',';
        }
        $('#email-extracted').text(text);
    } else {
        $('#email-extracted').text('** Ignoring comment, too many email addresses (' + emails.length + ').');
    }
});

Answer 2

Try this...

 function extractEmails (text) { return text.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\\.[a-zA-Z0-9._-]+)/gi); } function eliminateDuplicates (arr) { var i; var len=arr.length; var out=[]; var obj={}; for (i=0;i<len;i++) { obj[arr[i]]=0; } for (i in obj) { out.push(i); } return out; } var emailsFullList = []; $('#email-extractor').keyup(function( index ) { var emails = extractEmails($(this).val()); if (!emails) { $('#email-extracted').val('** No emails in comment'); } else if (emails.length < 3) { emailsFullList = emailsFullList.concat(emails); } else { $('#email-extracted').val('** Ignoring comment, too many email addresses ('+emails.length+').'); } emailsFullList = eliminateDuplicates(emailsFullList); $('#email-extracted').val(emailsFullList.join()); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <textarea id="email-extractor" class="email-extractor-textarea"></textarea> <textarea id="email-extracted" class="email-extractor-textarea"></textarea> 

You need to move these lines...

emailsFullList = eliminateDuplicates(emailsFullList);

$('#email-extracted').text(emailsFullList.join());

into your .keyup() otherwise they are only run on page load. Also, when working with textarea I believe you should be using .val() rather than .text() to get/set the value